将数据从@Model 传递到同一剃刀页面中的表单

Question

我想将@item.Id 的值传递给位于同一剃须刀页面中的此循环外的表单

@foreach (var item in Model.GetContracts)
        {
    <tr>
        <td>@item.Plate</td>
        <td>@item.Cname</td>
    
        <td>@item.CheckIn.ToString("dd/MM/yyyy")</td>
        <td>@item.CheckOut.ToString("dd/MM/yyyy")</td>
        <td>@item.Price</td>
        <td>@item.Paid</td>
        <td>@item.Deposit</td>
        <td>@item.Note</td>
        <td>@item.Id</td>
    
        <td><Button type="button" class="btn btn-success" data-toggle="modal" data-target="#Returned" onclick="getId">إغلاق العقد</Button></td>
        <td><a class="btn btn-warning" asp-page="Returned" asp-route-Id="@item.Id">تجديد</a></td>
        
        
            
        
    </tr>
      }

我想把@item.Id放在asp-route-id="@item.Id"

<!-- Modal for returned -->
<div class="modal fade" id="Returned" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLongTitle"></h5>
                <button type="button" cl ass="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <form method="post" asp-page-handler="Returned" asp-route-id="">
                    
                    

                    
                    <input type="date" asp-for="@Model.Update" />

                    <input type="submit" class="btn btn-primary" />
                </form>
            </div>
        </div>
    </div>
</div>

ps：我不能将表单放入循环中，因为它总是读取列表中第一项的@item.Id，因为'div cant be nested in a tr or table'

Answer 1

您可以将表单添加为您的 table 的单独列，并在那里传递您的 ID。

@foreach (var item in Model.GetContracts)
{
<tr>
    <td>@item.Plate</td>
    <td>@item.Cname</td>

    <td>@item.CheckIn.ToString("dd/MM/yyyy")</td>
    <td>@item.CheckOut.ToString("dd/MM/yyyy")</td>
    <td>@item.Price</td>
    <td>@item.Paid</td>
    <td>@item.Deposit</td>
    <td>@item.Note</td>
    <td>@item.Id</td>

    <td><Button type="button" class="btn btn-success" data-toggle="modal" data-target="#Returned" onclick="getId">إغلاق العقد</Button></td>
    <td><a class="btn btn-warning" asp-page="Returned" asp-route-Id="@item.Id">تجديد</a></td>
    <td>
        <div class="modal-body">
            <form method="post" asp-page-handler="Returned" asp-route-id="@item.id">
               <input type="date" asp-for="@Model.Update" />

                <input type="submit" class="btn btn-primary" />
            </form>
        </div>
    </td>
</tr>
}

Answer 2

正如@Yuri 所说，您可以将模型弹出窗口放在 TD 和 foreach 循环内。但是你会发现它仍然会调用第一个模型，因为 data-target="#Returned" 只是为 #Returned 设置了目标来避免这个动作，我建议你可以尝试修改你的代码以使用 for循环而不是使用 foreach 并将每一行的 return 模型弹出 ID 设置为 return_@i.

更多详情，您可以参考以下代码：

@for (int i=0; i<Model.Count; i++)
{
    
    <tr>
    <td>@Model[i].Plate</td>
    <td>@Model[i].Cname</td>

    <td>@Model[i].CheckIn.ToString("dd/MM/yyyy")</td>
    <td>@Model[i].CheckOut.ToString("dd/MM/yyyy")</td>
    <td>@Model[i].Price</td>
    <td>@Model[i].Paid</td>
    <td>@Model[i].Deposit</td>
    <td>@Model[i].Note</td>
    <td>@Model[i].Id</td>
       
        
    <td><Button type="button" class="btn btn-success" data-toggle="modal" data-target="#Returned_@i" onclick="getId">إغلاق العقد</Button></td>

    <td><a class="btn btn-warning" asp-page="Returned" asp-route-Id="@Model[i].Id">إغلاق العقد</a></td>
    <td><a class="btn btn-warning" asp-page="CheckOut" asp-route-Id="@Model[i].Id">تجديد</a></td>

    <td>
        <div class="modal fade" id="Returned" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
            <div class="modal-dialog modal-lg" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title" id="exampleModalLongTitle"></h5>
                        <button type="button" cl ass="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <form method="post" asp-page-handler="Returned" asp-route-id="@Model[i].Id">
                            @item.Id



                            <input type="date" asp-for="@Model[i].Update" />

                            <input type="submit" class="btn btn-primary" />
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </td>
    <td>
            <div class="modal fade" id="Returned_@i" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
                <div class="modal-dialog modal-lg" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title" id="exampleModalLongTitle"></h5>
                            <button type="button" cl ass="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">&times;</span>
                            </button>
                        </div>
                        <div class="modal-body">
                            <form method="post" asp-route-id="@Model[i].Id">
                                @Model[i].Id            
                                <input type="date" asp-for="@Model[i].Update" />  
                                <input type="submit" class="btn btn-primary" />
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </td>

  
</tr>

}

将数据从@Model 传递到同一剃刀页面中的表单

pass the data out of @Model to a form in the same razor page

c#

razor

asp.net-core

razor-pages

asp.net-core-razor-pages