使用ajax和asp.net核心中的部分视图进行分页和搜索



我使用的是.net核心6和我有一个带有分页的表,如果表页面发生更改,它会刷新页面我想使用partialview和Ajax 在不刷新的情况下更改表格页面

控制器:

public ActionResult Index(int pageId = 1)
{
UsersForAdminViewModel usersForAdminViewModel=_userService.GetAllUsers(pageId);
return View(usersForAdminViewModel);
}

用户服务:

public UsersForAdminViewModel GetAllUsers(int pageId = 1)
{
IQueryable<User> result = _context.Users;
int take = 1;
int skip = (pageId - 1) * take;
UsersForAdminViewModel usersForAdminViewModel = new UsersForAdminViewModel();
usersForAdminViewModel.CurrentPage = pageId;
usersForAdminViewModel.PageCount = result.Count() / take;
usersForAdminViewModel.Users = result.OrderByDescending(d => d.RegisterDate).Skip(skip).Take(take).ToList();

return usersForAdminViewModel;
}

视图:

@model UsersForAdminViewModel
<table class="table table-striped table-bordered table-hover">
<thead>
<tr>
<th>Avatar</th>
<th>UserName</th>
<th>operation</th>
</tr>
</thead>
<tbody>
@foreach (var item in Model.Users)
{
<tr>
<td>
<img src="/Images/UserAvatars/Thumb/@item.UserAvatar"/>
</td>
<td>@item.UserName</td>
<td>
<a asp-action="Details" asp-route-id="@item.UserId" class="btn btn-outline btn-warning">Details</a>
</td>
</tr>
}
</tbody>
</table>       
<ul class="pagination">
@for (int i = 1; i <= Model.PageCount; i++)
{                  
<li class="paginate_button" aria-controls="dataTables-example" tabindex="0">
<a asp-action="Index" asp-route-pageId="@i">@i</a>
</li>
}
</ul>

你能告诉我怎么做吗?

谢谢

你能展示你的关于局部视图的代码吗?

脚本可能如下所示:

<script>
$(document).ready(function () {
$("#btRefresh").click(function () {
$.ajax({
type: "POST",
url: "/Test/TestRefresh",
success: function (data) {
$("#TestDiv").html(data);
},
error: function (msg) {
alert('error:' + msg);
}
});
});
});
</script>

控制器:

[HttpPost]
public ActionResult TestRefresh()
{
somelogicalcodes
return PartialView("PartialName", somelist);
}

最新更新