Considerations for Using MvcPager Paging Controls

  • 2021-09-24 22:04:59
  • OfStack

Beginner MVC, do a single page application, need to display multiple pages, and no refresh update.

Found MvcPager control, very easy to use, in the process of using ajax encountered many problems. Slowly debug and ask Mr. Yang (author of MvcPaegr), and always solve it.

First, the NuGet package is added. Search MvcPager to find it.

The controller side must reference

using Webdiyer.WebControls.Mvc;

There are not many records at the back end. Look at the official Demo and almost understand it. Mainly record the front end.


 <div>
  @Ajax.Pager(Model, new PagerOptions
 {
  ShowFirstLast = false,// Display number 1 Page button 
  ShowPrevNext = false,// Show the last 1 Page button 
  NumericPagerItemCount = 5,// Maximum number of page numbers displayed 
  PageIndexParameterName = "page",// Paging parameter passed to the back end, which must be different if there are multiple pages on the same page 
  Id = "callajax",// Of the paging control ID To modify the content needs to refresh the page to use. 
  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 })
 </div>

Then add the paging control where it needs to be refreshed after execution. If it is added or deleted, it will be executed


Webdiyer.MvcPagers.getById("callajax").ajaxReload();// In here ID Is specified by the paging control ID 

Important. Using the above method requires adding a method to the jQuery plug-in of MvcPager. js


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: [] });
 },

Importantly, after MvcPager. js is modified, the JS script registration method of MvcPager cannot be used.

Just quote MvcPager. js directly.


Related articles: