前臺(tái)分頁(yè)數(shù)據(jù),適合數(shù)據(jù)少量的時(shí)候,因?yàn)榉猪?yè)的數(shù)據(jù)是從后臺(tái)獲取的,大數(shù)據(jù)的話不建議使用
@{
Layout = null;
}
!DOCTYPE html>
html>
head>
meta name="viewport" content="width=device-width" />
script src="~/kkpager/lib/jquery-1.10.2.min.js">/script>
script src="~/kkpager/src/kkpager.js">/script>
link href="~/kkpager/src/kkpager_orange.css" rel="external nofollow" rel="stylesheet" />
title>Index/title>
/head>
body>
div style="width:800px;margin:0 auto;">
div class="table-responsive" id="mainContent">
/div>
div id="kkpager">
/div>
/div>
/body>
/html>
script type="text/javascript">
function getParameter(name) {
var reg = new RegExp("(^|)" + name + "=([^]*)(|$)");
var r = window.location.search.substr(1).match(reg);
if (r != null) return unescape(r[2]); return null;
}
function GetExcelTable(pageindex) {
$.ajax({
url: '/Home/index2',
dataType: "json",
type: "POST",
data: { "pageIndex": pageindex },
success: function (data) {
if (data.status == "0") {
$("#mainContent").empty();
$("#mainContent").html("div style='text-align:center; color:red'>h2>暫無(wú)數(shù)據(jù)/h2>/div>");
return;
}
$("#mainContent").html(data.data);
//定義分頁(yè)樣式
var totalCount = parseInt(data.pagecount);
var pageSize = parseInt(data.pagesize);
var pageNo = getParameter('pageIndex');//該參數(shù)為插件自帶,不設(shè)置好,調(diào)用數(shù)據(jù)的時(shí)候當(dāng)前頁(yè)碼會(huì)一直顯示在第一頁(yè)
if (!pageNo) {
pageNo = pageindex;
}
var totalPages = totalCount % pageSize == 0 ? totalCount / pageSize : (parseInt(totalCount / pageSize) + 1);
kkpager.generPageHtml({
pno: pageNo,
total: totalPages,
totalRecords: totalCount,
mode: 'click',
click: function (n) {
this.selectPage(pageNo);
searchPage(n);
return false;
}
}, true);
}, error: function (jqXHR, textStatus, errorThrown) {
}
});
}
//init
$(function () {
GetExcelTable(1)
});
//ajax翻頁(yè)
function searchPage(n) {
GetExcelTable(n);
}
/script>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Web;
using System.Web.Mvc;
namespace MvcKKpager.Controllers
{
public class HomeController : Controller
{
private readonly int pageSize = 2;
//
// GET: /Home/
public ActionResult Index()
{
return View();
}
public ActionResult Index2(string pageIndex) {
ListString> list = new ListString>();
list.Add("保護(hù)環(huán)境");
list.Add("保護(hù)環(huán)境");
list.Add("保護(hù)環(huán)境");
list.Add("保護(hù)環(huán)境");
list.Add("保護(hù)環(huán)境");
var persons = (from p in list select p).Skip((int.Parse(pageIndex) - 1) * pageSize).Take(pageSize);
StringBuilder builder = new StringBuilder();
builder.Append("table class=\"table table-striped b-t b-light text-sm\" id=\"comptable\">");
builder.Append("thead>tr>th>時(shí)間/th>th>展示/th>th>點(diǎn)擊(點(diǎn)擊率)/th>th>激活(激活率)/th>th>平均點(diǎn)擊單價(jià)/th>th>實(shí)際激活成本/th>th>消耗/th>/tr>/thead>");
builder.Append("tbody>");
foreach (var item in persons) {
builder.Append("tr class=\"trStyle\">");
builder.Append("td>" + item + "/td>");
builder.Append("td>" + item + "/td>");
builder.Append("td>" + item+"/td>");
builder.Append("td>" + item + "/td>");
builder.Append("td>" + item + "/td>");
builder.Append("td>" + item + "/td>");
builder.Append("td>" + item + "/td>");
builder.Append("/tr>");
}
builder.Append("/tbody>/table>");
var result = new { status = "1", data = builder.ToString(), pagecount = list.Count().ToString(), pagesize = pageSize.ToString() };
return Json(result);
}
}
}
以上所述是小編給大家介紹的kkpager 實(shí)現(xiàn)ajax分頁(yè)查詢功能實(shí)例代碼,希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!