分頁控件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 + "}";
}
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章