如何在ASP.NET核心中加载AJAX中的部分视图

本文介绍了如何在ASP.NET核心中加载AJAX中的部分视图的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述 当我更改按ajax分页时，我希望每行加载我的部分视图。我的部分负责表格中每一行的按钮 我有一个如下的部分视图：

@model Guid <td style="width: 150px"> <div class="btn-group" role="group"> <a asp-action="Edit" asp-route-id="@Model" class="btn btn-primary text-white"><i class="fas fa-edit"></i></a> <a asp-action="Details" asp-route-id="@Model" class="btn btn-success text-white"><i class="fas fa-list-alt"></i></a> <a asp-action="Delete" asp-route-id="@Model" class="btn btn-danger text-white"><i class="fas fa-trash-alt"></i></a> </div> </td>

我在我的表中每行使用以下内容：

<table id="exp" class="table table-striped border"> <tr class="table-secondary"> <th> @Html.DisplayNameFor(c => c.List.FirstOrDefault().Title) </th> <th></th> <th></th> </tr> @foreach (var expertise in Model.List) { <tr> <td>@Html.DisplayFor(c => expertise.Title)</td> <td> <partial name="_TableButtonPartial" model="@expertise.Id" /> </td> </tr> } </table> <div page-model="@Model.PagingInfo" page-classes-enabled="true" page-class="btn border" page-class-normal="btn btn-light" page-class-selected="btn btn-info active" class="btn-group float-right"> </div>

所以我想让AJAX分页，但我不知道如何在AJAX中加载每行的Patial

@section Scripts { @{ await Html.RenderPartialAsync("_ValidationScriptsPartial");} <script type="text/javascript"> function goToPage(param) { var url = '@Url.Content("~/")' + param; $.ajax({ url: url, type: 'GET', dataType: 'text', success: function (data) { var results = JSON.parse(data); var items = ''; $('#exp').empty(); $.each(results.list, function (i, expertise) { items+= "<tr>" + "<td>" + expertise.title + "</td>" + "<td>" + "<partial name='_TableButtonPartial' model='" + expertise.id + "'/>" + "</td>" + "</tr>"; }); $('#exp').html(items); } }); } </script> } 推荐答案

如何在AJAX中按行加载此部分

您可以修改代码以动态获取部分视图的html并填充表，如下所示。

$.each(results.list, function (i, expertise) { //make request to get the html of partial view //and generate new rows to populate table $.get("/Home/GetPartial/" + expertise.id, function (res) { var newrow = "<tr>" + "<td>" + expertise.title + "</td>" + "<td></td>" + res + "</tr>"; items += newrow; if (i == results.list.length - 1) { $('#exp').html(items); } }); });

控制器操作

[Route("{controller}/{action}/{id:guid}")] public IActionResult GetPartial(Guid id) { return PartialView("_TableButtonPartial", id); }