我需要創建一個包含有分頁、排序和搜索的表格的視圖。我從后端 api 獲取資料,然后將其傳遞給視圖。
我的動作方法是這樣的:
我的動作方法是這樣的:
public async Task<IActionResult> Home(int page = 1)
{
var list = await _service.Get<List<Model.Rezervacija>>(page)。
ViewBag.Page = page;
回傳View(list)。
}
而我有這樣的視圖:
@using eBiblioteka.Model
@model List<Rezervacija>
@{
ViewBag.Title = "Home";
Layout = "~/Views/Shared/_Layout.cshtml"。
}
<div id="view-all">
@await Html.PartialAsync("_ViewAll", Model, null)
</div>
<a asp-action="Home" asp-route-page="@(ViewBag.Page - 1)"> Previous</a>
<a asp-action="Home" asp-route-page="@(ViewBag.Page 1)">Next</a>
而這一切都在運作。不要注意像這樣顯示頁數和改變上一頁和下一頁,我只是想簡化我的問題。所以,當我點擊下一頁時,資料會發生變化,表格也會快速更新,這不是問題。
那么在asp .net core中是否有任何解決方案可以做到這一點而不看到頁面多載。我需要再次呼叫我的動作來改變這個引數 "page",然后從api中獲取新的資料,而不會看到那個丑陋的頁面重新加載。 謝謝你的所有解決方案。
uj5u.com熱心網友回復:
所以你想創建一個包含分頁、排序和搜索的表格的視圖,而不需要重新加載。所以你應該使用jquery來實作。
@using eBiblioteka.Model
@model IEnumerable<Rezervacija>
<div>
<table class="table table-striped border" id="myTable">
<thead>
<tr class="table-info">
<th>
@Html.DisplayNameFor(c => c.Name)
</th>
<th>
@Html.DisplayNameFor(c => c.SpecialTagId)
</th>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
@foreach (var item in Model)
{
<tr>
<td> @item.Name </td>
<td> @item.SpecialTag.Name </td>
<td>
<partial name="_ButtonPartia3" model="@item.Id" /> //你可以使用區域視圖來洗掉或添加資料。
</td>
</tr>
}
</tbody>
</table>
</div>
<br /> <br />
@section scripts{
<script src="https://cdn.datatables.net/1.11.2/js/jquery.dataTables.min.js"></script>
<script type="text/javascript">
$(document).ready( function () {
$('#myTable').DataTable()。
});
</script>
}
然后在你的_Layout.cshtml中添加下面這個鏈接:-
<link rel="styleheet" type="text/css" href="https://cdn.datatables.net/1.11.2/css/jquery.dataTables.min.css">
而你的輸出將是這樣的:-
因此,當你從一個頁面到另一個頁面時,它將不會重新加載,因為你使用了jquery。而且它已經被分類,你也可以根據需要進行搜索。
uj5u.com熱心網友回復:
轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/328663.html
標籤:




