首页 >web前端 >js教程 >分享一个asp.net pager分页控件_jquery

分享一个asp.net pager分页控件_jquery

WBOY
WBOY原创
2016-05-16 17:57:361368浏览

效果:


js:

复制代码 代码如下:

$.fn.extend({ JPager: function (cfg, pageIndex, pageSize) {
if (cfg && pageIndex > 0 && pageSize>0) {
var token = "#" this.attr("id");
this.empty()
var pageFirst = function () {
$(token).JPager(cfg, 1, pageSize);
var pagePre = function () {
$(token).JPager(cfg, pageIndex - 1, pageSize);
var pageLast = function () {
$(token) ).JPager(cfg, parseInt($("#_tot").val()),
};
var pageNext = function () {
$(token).JPager(cfg); , pageIndex 1, pageSize);
}
var pageNumber = function () {
$(token).JPager(cfg, parseInt($(this).text()), pageSize); 🎜>};
var pageGo = function () {
var index = parseInt($("#_pos").val());
var Total = parseInt($("#_tot") .val());
if (索引) {
if (索引 > 总计) {
$(token).JPager(cfg, 总计, pageSize)
else; if (index $(token).JPager(cfg, 1, pageSize);
}
else {
$(token).JPager(cfg, index, pageSize); ;
}
}
}; var checkGoNumber = function () {
if (!Number(this.value)) {
this.value = "";
}
else {
this.value = Number(this.value);
}
};
var initCustomer = function (recordCount) {
if (cfg.customer) {
if (cfg.customer.template) {
var t = cfg.customer.template;
t = t.replace(/%total%/gi, Math.ceil(recordCount / pageSize)).replace(/%current%/gi, pageIndex).replace(/%recordCount%/gi, recordCount).替换(/%pageSize%/gi, pageSize);
if (cfg.customer.position == "right") {
$("#_right").after(t);
}
else {
$("#_left").before(t);
}
}
}
};
var changeState = function (total) {
if (pageIndex == 1) {
$("#_first").attr("class", "unable");
$("#_pre").attr("class", "unable");
}
else {
$("#_first").bind("click", pageFirst).attr("class", "number");
$("#_pre").bind("click", pagePre).attr("class", "number");
}
if (pageIndex == Total) {
$("#_last").attr("class", "unable");
$("#_next").attr("class", "unable");
}
else {
$("#_last").bind("click", pageLast).attr("class", "number");
$("#_next").bind("click", pageNext).attr("class", "number");
}
};
var initNumber = function (total, count, current) {
if (total > 0 && count > 0) {
if (current current = 1; }
}
if (当前>总计) {
当前 = 总计;
}
var endIndex = 总计;
var startIndex = 1;
var temp = 当前 Math.floor(count / 2);
if (temp if (temp endIndex = count;
}
else {
startIndex = temp - 计数 1;
endIndex = 临时;
}
}
else {
if (总计 > 计数) {
startIndex = 总计 - 计数 1;
}
}
$("#_number").empty();
for (var i = startIndex; i var html = $("").text(i).bind("click" ,页码);
if (i == current) {
$("#_number").append(html.attr("class", "selected"));
}
else {
$("#_number").append(html.attr("class", "number"));
}
}
}
};
var initPager = function (data) {
if ($.isArray(data.SearchResult) && data.RecordCount > 0) {
$(token).append("首页 上一页 下一页 末页");
var Total = Math.ceil(data.RecordCount / pageSize);
$("#_tot").val(总计);
$("#_pos").bind("blur", checkGoNumber);
$("#_to").bind("点击", pageGo);
changeState(总计);
if (cfg.showNumber && cfg.count > 0) {
initNumber(total, cfg.count, pageIndex);
}
initCustomer(data.RecordCount);
}
};
if (cfg.action) {
if (cfg.action.url && cfg.action.data) {
var d = cfg.action.data.substr(0, cfg.action.data. lastIndexOf("}")) ',"pageIndex":' pageIndex ',"pageSize":' pageSize "}";
if (cfg.action.callback && $.isFunction(cfg.action.callback)) {
$.ajax({
type: "post",
url: cfg.action.url ,
dataType: "json",
contentType: "text/json",
数据: d,
成功: 函数 (data) {
initPager(data.d); >cfg.action.callback(data.d)
}
});
}
else {
$.ajax({
type: "post",
url: cfg.action.url,
dataType: "json",
contentType: "text/json",
data: d,
success: function (data) {
initPager(data.d);
}
});
}
}
}
}
}
});

css:
复制代码 代码如下:

#_pos {
width: 40px;
}
.unable
{
color: #BCC0BB;
}
.number
{
margin: 2px;
color:#0000FF;
text-decoration:underline;
}
.selected
{
margin: 2px;
color: #FF0000;
font-weight: bold;
}

html:
复制代码 代码如下:




分页控件示例












wcf:
复制代码 代码如下:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Runtime.Serialization;
using System.ServiceModel;
using System.ServiceModel.Activation;
using System.ServiceModel.Web;
namespace JPlugin
{
[ServiceContract]
[AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]
public class JService
{
[OperationContract]
[WebInvoke]
public PageObject GetPersons(string name,int pageIndex,int paseSize)
{
return new PageObject(){RecordCount = 23,SearchResult = new List(){new Person(){Name="zhpulq",Age = 28},new Person(){Name = "zhouxy",Age = 24}}};
}
}
public class PageObject
{
public int RecordCount { get; set; }
public List SearchResult { get; set; }
}
}
声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn