Paging Options & Toolbar

Previous Next

Out of the box, the grid offers up a pager bar (or a tool bar) on top. This bar includes paging buttons, and on basis of the various enableXXX flags, shows other buttons to manage filters, footers, preferences, export, etc.


If you set enablePaging=true, the bar will show up. If you do not want paging, but still want the bar to show up, you can set forcePagerRow=true.


Often times, you may want to customize the appearance of the tool bar. This is quite easy to do. The grid has a pager renderer property. Renderers are discussed more in detail here. The way you set pager renderers is below:


           grid.setPagerRenderer(new flexiciousNmsp.ClassFactory(flexiciousNmsp.CustomPagerControl));


You can see a running example of this here: http://blog.htmltreegrid.com/post/How-to-Customize-the-Pager-(Toolbar)-Export-Options-Settings-and-Save-Settings-Popups.aspx


Finally, there is a difference in server paging and client paging. We discuss more about the filterPageSortMode here. Client paging is the default and will work without you having to do anything other than setting enablePaging=true. For server paging, you have to listen to the filterPageSortChange event and send a server request on basis of the filter object. A running example can be found here: http://www.reactdatagrid.com/demo/#fulllazyload