jQuery Pagination分页插件 |
您所在的位置：网站首页 › getpagelist › jQuery Pagination分页插件 |
|
源码：https://github.com/SeaLee02/FunctionModule/blob/master/UploadFiles/WebDemo/FenYE/FenYeAjax.aspx 代码版无刷新 插件刷新版 原理：点页码的时候，我们不再去访问这个页面，而是去访问一般处理程序，把当前页，每页显示的大小，传过去，然后我们去获取数据，然后返回到前台，用js进行处理。（原理理解了，你会发现说到无刷新差不多都是这样的套路） 提问：我们什么时候去访问处理程序，或者说在那里进行这个操作 这个插件有个回调函数，并且这个回调函数里面自带一个当前页的参数，那还等什么，就是它了
前面都是一样的： 序号 名字 父级ID 显示共条数据，共页，当前第页
js： $(function () { $("table").tableUI(); //分页插件方法 $(".page").pagination(, { num_edge_entries:1, //边缘页数 num_display_entries:4, //主体页数 callback:pageCallback, //回调函数 items_per_page:, //每页显示条数 current_page:, //当前页 prev_text: "上一页", next_text: "下一页" //分页链接 strUrl是需要传递的参数 get提交 }); //回调函数 function pageCallback(page_id,jq){ //page_id 为 当前页码-1 注意这个page_id，你点第一页它是0，你点第3页它是2 需要小心了 $.ajax({ type:"Post", url:"FenYe.ashx", dataType:"json", data:"page="+page_id+"&pageSize="+, async:true, success:function(data){ $("table tr:gt(0)").remove(); var GetData=eval(data); $.each(GetData,function(i,item){ var dd=""+i+""+item.Name+""+item.Pid+""+item.LevalNum+""; // $("table").append(""+(++i)+""+item.Name+""+item.Pid+""+item.LevalNum+""); $("table").append(dd); }) } }) return true; //返回真就刷新，返回假不会刷新 } });后台跟刷新一样的 public partial class FenYeAjax : System.Web.UI.Page { public int RowIndex = 1; public int page = 0; public int pcount = 0; public int pagesize = 2; public string strUrl = ""; protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { pcount = new FunctionDemo.BLL.Category().GetRecordCount("1=1"); repList.DataSource = new FunctionDemo.BLL.Category().GetPageList("1=1", pagesize, page); repList.DataBind(); } } }我们的一般处理程序 需要引用： 需要引用，这个外部的 public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/plain"; int page = context.Request.Form["page"] == null ? 0 : Convert.ToInt32(context.Request.Form["page"].ToString()); int pageSize = Convert.ToInt32(context.Request.Form["pageSize"]); DataTable dt = new FunctionDemo.BLL.Category().GetPageList("1=1", pageSize, page).Tables[0]; context.Response.Write(JsonConvert.SerializeObject(dt)); } 效果：
这个过程是不刷新的。 |
| CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |