Steps for paging:
1. First, query the obtained data from the database according to the paging parameters sent from the front page.
2. The data includes how many pages can be divided for investigation and handling, and the data displayed on each page.
3. Return to the paging plugin, and the data is handed over to the front-end page for display.
// query parameters
//getFormData to get foreground data
var requestParam = jQuery.extend(this.getFormData(this.options.queryForm) ,
//pageParam paging request parameter, if it is empty, the first page data is requested by default
pageParam ? pageParam : {
pagenum : 0
}) ;
//The data containing three keys in pageobj are pagenum (current page number), pagesize (current page size), totalelements (all records), pageNumClickFn//The processing function of paging click
initPaginationByObject : function(pageobj , initPageNumClickFn){
//The paging initialization object is not empty, and the required paging parameters are all numbers, then initialize the paging plugin
if(pageobj && !isNaN(pageobj.pagenum) &&
!isNaN(pageobj.pagesize) && !isNaN(pageobj.totalelements)){
this.initPagination(pageobj.pagenum, pageobj.pagesize,
pageobj.totalelements, initPageNumClickFn);
}
//each click swap function
var callbackFn = function(clickedPageNum , pageContainer){
//For the same page of the request, do not send the request repeatedly
if(Number(this.pageNum)==Number(clickedPageNum)){
return ;
}
this.pageNum = clickedPageNum;
//If the callback function is set, execute, the first parameter defaults to the paging parameter
if(this.pageNumClickFn){
//Get the paging request parameters, including the pagination number, the default does not include the size of each page and the number of all records.
this.pageNumClickFn.call(null , this.getPageParam(true)) ;
}
}.bind(this) ;
//Pagination plugin property configuration
var optInit = {
current_page: this.pageNum
items_per_page : this.pageSize ,
num_display_entries : 5 ,
num_edge_entries : 2 ,
prev_text : "Previous page" ,
next_text : "Next page" ,
callback : callbackFn ,
prev_show_always : false ,
next_show_always : false
};
//Only override the custom properties in the paging plugin
for ( var optKey in optInit) {
if(this.options[optKey]){
optInit[optKey] = this.options[optKey] ;
}
}
//initialize paging
$(paginationId).pagination(this.totalelements , optInit); //Actually perform pagination
parameter name description parameter value
| maxentries | total number of entries | Required parameter, integer |
| items_per_page | Number of items displayed per page | Optional parameter, default is 10 |
| num_display_entries | The number of pagination entries displayed in the body part of a continuous pagination | Optional parameter, default is 10 |
| current_page | currently selected page | Optional parameter, the default is 0, which means page 1 |
| num_edge_entries | The number of items displayed on both sides of the first and last pagination | optional parameter, default is 0 |
| link_to | paginated links | String, optional parameter, default is "#" |
| prev_text | The text displayed on the "Previous" pagination button | String parameter, optional, default is "Prev" |
| next_text | The text displayed on the "Next" pagination button | String parameter, optional, default is "Next" |
| ellipse_text | What text is used to indicate the number of pages omitted? | Optional string parameter, default is "..." |
| prev_show_always | Whether to show the "previous" pagination button | Boolean, optional parameter, the default is true, that is, the "previous page" button is displayed |
| next_show_always | Whether to show the "next page" pagination button | Boolean, optional parameter, the default is true, that is, the "next page" button is displayed |
| callback | Callback | No execution effect by default |