分页控件layui的使用
$.getJSON( )的使用方法简介
$.getJSON( url [, data ] [, success(data, textStatus, jqXHR) ] )
url是必选参数,表示json数据的地址;
data是可选参数,用于请求数据时发送数据参数;
success是可参数,这是一个回调函数,用于处理请求到的数据。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 | //内容页面 <br> <div id="notice_div"></div><br> //分页控件 <div id= "notice_pages" ></div> <script> var roolurl = "http://" + window.location.host; var urlAshx = roolurl + "/aa/Ashx/NoticeInfo.ashx" ; //var pages = 0; //获取分页好的公告内容 function GetNoticeList(curr, cid) { $.getJSON(urlAshx, { //参数 action: "notice_action" , courseid: cid, page: curr || 1, //向服务端传的参数,此处只是演示 nums: 3 //每页显示的条数 }, function (datajson) { //成功执行的方法<br> if (datajson != null && typeof (datajson) == "string" && datajson.length > 0) { <br> try { datajson = JSON.parse(datajson); } catch (e) { datajson = eval("(" + datajson + ")"); } } var norice_content = "" ; //alert(datajson.pages); $(datajson.rows).each( function (n, Row) { norice_content += " <div class='panel panel-default'>" ; norice_content += " <div class='panel-heading'>" ; norice_content += " <h3 class='panel-title'>" ; norice_content += Row.CreateDate; norice_content += " " ; norice_content += Row.Creater; norice_content += " </h3>" ; norice_content += " </div>" ; norice_content += " <div class='panel-body'>" ; norice_content += Row.NoticeContent; norice_content += " </div>" ; norice_content += " </div>" ; }); $( '#notice_div' ).html(norice_content); //alert(11); //调用分页 laypage({ cont: 'notice_pages' , //容器。值支持id名、原生dom对象,jquery对象。【如该容器为】:<div id="page1"></div> pages: datajson.pages, //总页数 groups: 5, //连续显示分页数 skip: false , //是否开启跳页 skin: '#AF0000' , curr: curr || 1, //当前页, jump: function (obj, first) { //触发分页后的回调 if (!first) { //点击跳页触发函数自身,并传递当前页:obj.curr GetNoticeList(obj.curr, cid); } } }); }); } $(document).ready( function () { GetNoticeList(0, '<%=_courseid%>' ) }); </script> |
后台数据反馈
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | private string GetNewsByPage(HttpContext context) { #region //分页 算法 int page = 0; int .TryParse(context.Request.Params[ "page" ], out page); //当前第几页 int nums = 0; int .TryParse(context.Request.Params[ "nums" ], out nums); //每页显示几条数据 int StartIndex = (page - 1) * nums + 1; int EndIndex = page * nums; #endregion //StringBuilder strWhere = new StringBuilder(); #region // 拼Sql Where 条件 #endregion int total = 0; DataTable dt = bll_News.GetListByPage( "" , "postdate" , StartIndex, EndIndex); total = bll_News.GetRecordCount( "" ); string strjosn = AppCode.DataTableConvertJson.DataTableToJson(dt); int pages = Convert.ToInt32(Math.Ceiling(( double )total / ( double )nums)); // 页数 return "{\"total\":" + total + ",\"pages\":" + pages + ",\"rows\":" + strjosn + "}" ; } |
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步