ASP. Net paging paging navigation instance

  • 2021-08-21 20:05:31
  • OfStack

Asp. Net paging can set the link text displayed in the foreground on the first page, the first page, the next page and the last page of paging. Here, we only mention simple functions, so it is more handy to study and analyze their principles in depth.


//containerId  The target container for navigation, it is recommended to use span Label 
   //url  Default to XXX.XX?pagenum=
   //curPage  Current page number 
   //maxSection  Maximum number of segments (1 Maximum number of pages in a paragraph )
   //totalPage  Total number of pages 
   function Navigate(containerId,url,curPage,maxSection, totalPage) {
     // To the first 1 Page symbol 
     var first = "|<<";
     // To the end 1 Page symbol 
     var last = ">>|";
     // Front 1 Page symbol 
     var back = "<"
     // Under 1 Page symbol 
     var next = ">";
     // Illegal page number processing  
     if (curPage > totalPage || curPage < 0) {
       curPage = 1;
     }
     // Get the navigation container parent element 
     var containerObj = document.getElementById(containerId);
     // Get the segment number of the current page ( After debugging for a long time, it turned out to be a type problem, but it was actually float Type )
     var curSection = Math.floor((curPage - 1) / maxSection + 1);
     // Get the last 1 Number of segments 
     var lastSection = Math.floor((totalPage - 1) / maxSection + 1);
     var html = "";
     // The current page is not the 1 Page, add to the first page, and before 1 Page 
     if (curPage > 1) {
       html += "... ";
     }
     // Paragraph of the current paragraph 1 Page number 
     var curSectionFirst = (curSection - 1) * maxSection + 1;
     // At the end of the current paragraph 1 Page number 
     var curSecitonLast = curSection * maxSection;
     // Output the page number of the current section 
     for (var i = curSectionFirst; i <= curSecitonLast && i <= totalPage; i++) {
       if (curPage == i) {
         html += "... ";
     }
     // The current page is not the last page, add the following 1 Page and last 1 Page symbol 
     if (curPage != totalPage) {
       html += "<a data-cke-saved-href="http://blog.csdn.net/jiangpeng59/article/details/" href="http://blog.csdn.net/jiangpeng59/article/details/'&quot;" +="" url="" (curpage="" 1)="" "&#39;="">" + next + " ";
       html += "
    }

Get the following paging navigation implementation effect as follows: < < < ... 9 10 11 12 13 14 15 16 ... > > > |


Related articles: