Pagination (paging) summary from foreground to backend

One: effect picture

Next, I will first go to the foreground of the web page and the partial pagination effect of the management end, they use a set of code.

Back to the top (go to top)

Second: some knowledge points before the code

This jQuery plug-in is an Ajax paging plug-in, which is loaded at one time, so there is no refresh and delay during paging switching. This method is not recommended if the amount of data is large, because the loading will be slow.

Name description parameter value maxentries total number of entries required parameter, integer items_per_page the number of entries displayed per page optional parameter, default is the number of paging entries displayed in the main part of 10num_display_entries continuous paging optional parameter, default is the 10current_page currently selected page optional parameter, default is 0, indicates the number of entries displayed on both sides of the first page num_edge_entries optional parameter, the default is 0link_to paging link string Optional parameter, default is the text string parameter displayed on the "#" prev_text "previous page" paging button, optional, default is the "Prev" next_text "next page" paging button displayed on the text string parameter, optional, default is "Next" ellipse_text omitted pages with what text to represent the optional string parameter, the default is "…" Whether prev_show_always displays "previous page" paging button Boolean type. Optional parameter. Default is true, that is, whether "previous page" button next_show_always displays "next page" paging button Boolean type, optional parameter, default is true, that is, display "next page" button callback callback function has no execution effect by default.

Back to the top (go to top)

Three: foreground code part

1 var pageSize = 6; / / how many records are displayed per page? 2 var total; / / the total number of records is 3 $(function () {4 Init (0); / / pay attention to the parameters. The initial page defaults to the parameters passed to the background. The first page is 0. 5 $("# Pagination") .pagination (total, {/ / total cannot lose 6 callback: PageCallback, 7 prev_text: 'previous', 8 next_text: 'next', 9 items_per_page: pageSize 10 num_display_entries: 4, / / the number of page entries displayed in the body of consecutive pages 11 num_edge_entries: 1, / / the number of entries in the first and last pages displayed on both sides 12}) 13 function PageCallback (index, jq) {/ / the previous one represents the page number index value of the page you currently clicked, and the latter parameter represents the load container. 14 Init (index); 15} 16}); 17 18 function Init (pageIndex) {/ / this parameter is the index value of the page number clicked on, the first page is 0, mentioned above, and the following part is the value passed by AJAX. 19 $.ajax ({20 type: "post", 21 url: ".. / getContentPaixuServ?Cat=" + str+ "& rows=" + pageSize+ "& page=" + pageIndex,22 async: "json", 24 success: function (data) {25 $(".neirong"). Empty (); 26 / * total = data.total; * / 27 var array = data.rows 28 for (var item0 endIndex=rows* ilist.size ()) {8 endIndex=list.size (); 9} 10 else {11 endIndex=rows* (page+1); 12} 13 for (int iTunes beginIndexteri