Razor 表单 foreach 返回相同的 id

Question

我有一个弹出带有文本区域的模式的按钮。当我单击模式中的“提交”按钮时，我想将数据传递给 post 方法（Description 和 OrderId）。问题在于 orderid 始终与第一个订单相同。例如，我单击 id 应该为 4 的订单，但它返回的 id 是 1（作为第一个订单），因此我将错误的 Id 传递给控制器。注意 - order.Id 在模态之外工作得很好，问题是当我将它传递给模态时。    @foreach (var order in Model .Where(x => Context.Request.Query["searchOption"] == "2" ? x.Status == "Completed" : x.Status == "Active")) {    <div class="card" style="width: 18rem; margin-left:1em; margin-bottom: 1em; margin-top: 1em">      <div class="card-body">        <h5 class="card-title">@order.ServiceName</h5>      </div>      <ul class="list-group list-group-flush">        <li class="list-group-item">@order.Address</li>        <li class="list-group-item">@order.StartDate</li>        <li class="list-group-item">@order.DueDate</li>        <li class="list-group-item">@order.HoursBooked</li>        <li class="list-group-item">@order.WorkersCount</li>        <li class="list-group-item">@order.Status</li>        <li class="list-group-item">@order.Price<text>$</text></li>            @if (order.Status == "Completed") {        <!-- Button trigger modal -->            <form method="post" asp-controller="Orders" asp-action="AddComplaint">          <!-- Modal Trigger -->          <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal">                                    Add Complaint                                </button>                </div>              </div>            </div>          </div>        </form>            }

Answer 1

你可以这样改变（在foreach之前添加i并在foreach中添加i++，更改按钮的data-target，并更改modal的id）：

@{ var i = 0;}

@foreach (var order in Model .Where(x => Context.Request.Query["searchOption"] == "2" ? x.Status == "Completed" : x.Status == "Active")) {

    i++;

    <div class="card" style="width: 18rem; margin-left:1em; margin-bottom: 1em; margin-top: 1em">

      <div class="card-body">

        <h5 class="card-title">@order.ServiceName</h5>

      </div>

      <ul class="list-group list-group-flush">

        <li class="list-group-item">@order.Address</li>

        <li class="list-group-item">@order.StartDate</li>

        <li class="list-group-item">@order.DueDate</li>

        <li class="list-group-item">@order.HoursBooked</li>

        <li class="list-group-item">@order.WorkersCount</li>

        <li class="list-group-item">@order.Status</li>

        <li class="list-group-item">@order.Price<text>$</text></li>

    

        @if (order.Status == "Completed") {

        <!-- Button trigger modal -->

    

        <form method="post" asp-controller="Orders" asp-action="AddComplaint">

          <!-- Modal Trigger -->

          <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal@(i)">

                                    Add Complaint

                                </button>

    

          <!-- Modal -->

          <div class="modal fade" id="exampleModal@(i)" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">

            <div class="modal-dialog">

              <div class="modal-content">

                <div class="modal-header">

                  <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>

                  <button type="button" class="close" data-dismiss="modal" aria-label="Close">

                                                    <span aria-hidden="true">&times;</span>

                                                </button>

                </div>

                <div class="modal-body">

                  ***<input name="OrderId" value="@order.Id" />

                  <textarea name="Description" style="height:100%; width:100%"></textarea>***

                </div>

                <div class="modal-footer">

                  <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>

                  <button type="submit" class="btn btn-primary">Submit</button>

                </div>

              </div>

            </div>

          </div>

        </form>

    

        }