This article mainly for you in detail the Mvcpager page control use of the attention, with a certain reference value, interested in small partners can refer to
Beginner MVC, do a single page application, need to display multiple paging, and no refresh updates.
Found the Mvcpager control, very useful, in the use of Ajax process encountered a lot of problems. Slowly debugging and teacher Yang (Mvcpaegr author) consulted, always solved.
First the NuGet package is added. Search Mvcpager can be found.
The controller side must reference
Using WEBDIYER.WEBCONTROLS.MVC;
The back end is not more records, look at the official demo almost all understand, the main record under the front.
<p> @Ajax. Pager (Model, new pageroptions { showfirstlast = false,//Show First page button Showprevnext = false,// Show last page button Numericpageritemcount = 5,//up to page number pageindexparametername = "page",//paging parameter passed to backend, if there are multiple pagination on the same page, This parameter must be different id = "Callajax",//the ID of the paging control, to be used to refresh the page after the content is modified. containertagname = "ul", CssClass = "pagination", currentpageritemtemplate = "<li class=\" active\ "><a href=\" #\ ">{0}</a ></li> ", disabledpageritemtemplate =" <li class=\ "disabled\" ><a>{0}</a></li> ", pageritemtemplate =" <li>{0}</li> "}, new Mvcajaxoptions {Updatetargetid =" calllogpage ", Enablehistorysupport = false}) </p>
Then add the place where you want to refresh the paging control after it is executed, if it is added or deleted.
Webdiyer.MvcPagers.getById ("Callajax"). Ajaxreload ();//This ID is the ID specified by the paging control
Important. Using the method above requires adding a method to the Mvcpager.js jquery plugin
Ajaxreload:function () { var context = this; Context.allowreload = true; Context.allowcache=false; var index = Context.__getpageindex (context.pageindexname); Context.__ajax (Index===0?1:index, {type:this.httpMethod, data: []}); },
Important, you will not be able to use the Mvcpager JS Script registration method after mvcpager.js modification.
Direct reference to the mvcpager.js is OK.