我有1700条记录。我想使用ajax对它们进行分页,以使页面加载更轻松。我可以根据所选页面每次进行分页并带来一组新记录。
问题 我在页面底部只显示了10个索引,选择了页面,左边是4,右边是5。现在我需要每次从jQuery / ajax发送到控制器的CurrentPage值,我将其作为ajax数据参数获取。问题在于返回当前页面值持久以查看我选择的下一页索引。我总是得到旧值而不是最后选择的页面值。我甚至使用ViewBag而不是tempData但没有成功。
查看代码:
@model IEnumerable<UrCompedDAL.DBModels.SlotMachineModel>
<div class="my-properties">
<table id="tbl_slots" class="table no-margin" data-search="true" data-pagination="false">
<tbody class="orgTbody">
@foreach (var item in Model)
{
<tr>
//Code for Slot list
</tr>
}
</tbody>
</table>
<ul class="paging">
@{
int i = 1;
int pg = Convert.ToInt32(TempData["Current"]);
if (i > 0 || i == ViewBag.PageSize)
{
<li>
<a href="#" class="lipaging"><<</a>
</li>
}
if (pg < 6)
{
for (i = 1; i < 11; i++)
{
<li>
<a href="#" class="lipaging">@i</a>
</li>
}
}
else
{
for (i = pg - 4; i < pg; i++)
{
<li>
<a href="#" class="lipaging">@i</a>
</li>
}
for (i = pg; i < pg + 6; i++)
{
<li>
<a href="#" class="lipaging">@i</a>
</li>
}
}
if (i > 1 || i < ViewBag.PageSize)
{
<li>
<a href="#" class="lipaging">>></a>
</li>
}
}
</ul>
</div>
<script>
$(document).ready(function () {
$('.lipaging').click(function () {
$("#loadingDiv").show();
$(this).addClass('active');
var pageThis = $(this).text();
var current = @TempData["Current"];
if (pageThis == '>>') {
pageThis = current +1;
}
if (pageThis == '<<') {
pageThis = current -1;
}
$.ajax({
type: 'get',
url: '@Url.Action("Index", "Game_SlotMachine")',
data: {
CurrentPage: pageThis
}
}).done(function (data) {
var startIndex = data.indexOf("<tbody");
var endIndex = data.indexOf("</tbody>");
var html = data.substring(startIndex, endIndex + 8);
$('#tbl_slots').html('');
$('#tbl_slots').html(html);
setTimeout(function () {
filter();
}, 300);
$("#loadingDiv").hide();
});
});
控制器代码:
public ActionResult Index(int id = 0, int CurrentPage = 1)
{
List<SlotMachineModel> slotmodel = new List<SlotMachineModel>();
slotmodel = UrCompedDAL.DataAccessor.Instance.GameAccessor.GetAllSlotMachines().ToList();
ViewBag.PageSize = slotmodel.Count / 10;
TempData["Current"] = CurrentPage;
slotmodel = slotmodel.Skip((CurrentPage - 1) * 10).Take(10).ToList();
return View(slotmodel);
}
请帮忙。
答案 0 :(得分:0)
将模型IEnumerable<UrCompedDAL.DBModels.SlotMachineModel>
打包到其他模型中,并将模型设置为新模型的属性。将此新模型作为视图的模型传递。您可以根据需要从控制器传递尽可能多的数据。
答案 1 :(得分:0)
问题在于您重新创建整个视图,但只从结果中更新table
var html = data.substring(startIndex, endIndex + 8);
$('#tbl_slots').html('');
$('#tbl_slots').html(html);
(您还应该重新考虑如何从视图中提取表格并使用部分表格)。
没有使用分页ul
的ajax / 2nd +渲染,并且&#34;抛弃&#34;每一次。
您可以使用与表相同的方式覆盖ul,也可以通过javascript(可能是前者)更新分页元素。
重复使用整个视图(而不是部分视图),你会得到类似的结果:
}).done(function (data) {
var html = $("<div/>").html(data);
$('#tbl_slots').html(html.find("#tbl_slots").html());
$('ul.paging').html(html.find("ul.paging").html());