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")) {&nbsp; &nbsp; i++;&nbsp; &nbsp; <div class="card" style="width: 18rem; margin-left:1em; margin-bottom: 1em; margin-top: 1em">&nbsp; &nbsp; &nbsp; <div class="card-body">&nbsp; &nbsp; &nbsp; &nbsp; <h5 class="card-title">@order.ServiceName</h5>&nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; <ul class="list-group list-group-flush">&nbsp; &nbsp; &nbsp; &nbsp; <li class="list-group-item">@order.Address</li>&nbsp; &nbsp; &nbsp; &nbsp; <li class="list-group-item">@order.StartDate</li>&nbsp; &nbsp; &nbsp; &nbsp; <li class="list-group-item">@order.DueDate</li>&nbsp; &nbsp; &nbsp; &nbsp; <li class="list-group-item">@order.HoursBooked</li>&nbsp; &nbsp; &nbsp; &nbsp; <li class="list-group-item">@order.WorkersCount</li>&nbsp; &nbsp; &nbsp; &nbsp; <li class="list-group-item">@order.Status</li>&nbsp; &nbsp; &nbsp; &nbsp; <li class="list-group-item">@order.Price<text>$</text></li>&nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; @if (order.Status == "Completed") {&nbsp; &nbsp; &nbsp; &nbsp; <!-- Button trigger modal -->&nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; <form method="post" asp-controller="Orders" asp-action="AddComplaint">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <!-- Modal Trigger -->&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal@(i)">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Add Complaint&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </button>&nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <!-- Modal -->&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="modal fade" id="exampleModal@(i)" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="modal-dialog">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="modal-content">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="modal-header">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <button type="button" class="close" data-dismiss="modal" aria-label="Close">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span aria-hidden="true">&times;</span>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </button>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="modal-body">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ***<input name="OrderId" value="@order.Id" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <textarea name="Description" style="height:100%; width:100%"></textarea>***&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="modal-footer">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <button type="submit" class="btn btn-primary">Submit</button>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; </form>&nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; }