Differences
This shows you the differences between two versions of the page.
Both sides previous revision Previous revision Next revision | Previous revision | ||
wiki:pager [2010/04/17 03:28] preichow |
wiki:pager [2017/12/09 14:42] (current) admin |
||
---|---|---|---|
Line 3: | Line 3: | ||
If your grid has only a few rows of data, then all the records will be viewable at the same time and you won't have to worry about navigating through pages of data. | If your grid has only a few rows of data, then all the records will be viewable at the same time and you won't have to worry about navigating through pages of data. | ||
- | But more likely, you will be dealing with large datasets and will want to display the available records a few at a time. And for that, you will need the Navigation Bar. | + | But more likely, you will be dealing with large sets of data, and you'll want to display a small number of available records at a time. For this functionality, you will need the Navigation Bar. |
<note>Pager is currently disabled for [[TreeGrid]] </note> | <note>Pager is currently disabled for [[TreeGrid]] </note> | ||
Line 12: | Line 12: | ||
Note that it is a <div>, not a <table>. Then, you identify the <div> to your grid by placing the name of the div in the grid setting called "pager". | Note that it is a <div>, not a <table>. Then, you identify the <div> to your grid by placing the name of the div in the grid setting called "pager". | ||
- | First, the HTML definition. We'll name it "gridpager": | + | First, the HTML definition. We'll name it "gridpager" : |
<code html> | <code html> | ||
Line 94: | Line 94: | ||
|lastpage|integer|Readonly property. Determines the total number of pages returned from the request. |0|No| | |lastpage|integer|Readonly property. Determines the total number of pages returned from the request. |0|No| | ||
|pager|mixed|Defines that we want to use a pager bar to navigate through the records. This must be a valid html element; in our example we gave the div the id of "pager", but any name is acceptable. Note that the Navigation layer (the "pager" div) can be positioned anywhere you want, determined by your html; in our example we specified that the pager will appear after the Table Body layer. The valid calls can be (using our example) 'pager', '#pager', jQuery('#pager'). I recommend to use the second one.|empty string. Currently only one pagebar is possible.|No| | |pager|mixed|Defines that we want to use a pager bar to navigate through the records. This must be a valid html element; in our example we gave the div the id of "pager", but any name is acceptable. Note that the Navigation layer (the "pager" div) can be positioned anywhere you want, determined by your html; in our example we specified that the pager will appear after the Table Body layer. The valid calls can be (using our example) 'pager', '#pager', jQuery('#pager'). I recommend to use the second one.|empty string. Currently only one pagebar is possible.|No| | ||
- | |pagerpos|string| Determines the position of the pager in the grid. By default the pager element when created is divided in 3 parts (one part for pager, one part for navigator buttons and one part for record information)|center|No| | + | |pagerpos|string| Determines the position of the pager in the grid. By default, when the pager element is created it's divided into 3 parts (one part for pager, one part for navigator buttons and one part for record information)|center|No| |
|pgbuttons|boolean|Determines if the Pager buttons should be shown if pager is available. Also valid only if pager is set correctly. The buttons are placed in the pager bar. |true|No| | |pgbuttons|boolean|Determines if the Pager buttons should be shown if pager is available. Also valid only if pager is set correctly. The buttons are placed in the pager bar. |true|No| | ||
|pginput|boolean|Determines if the input box, where the user can change the number of requested page, should be available. The input box appear in the pager bar. |true|No| | |pginput|boolean|Determines if the input box, where the user can change the number of requested page, should be available. The input box appear in the pager bar. |true|No| | ||
Line 122: | Line 122: | ||
One event of the grid relates to the Pager: | One event of the grid relates to the Pager: | ||
^Event^Parameters^Description^ | ^Event^Parameters^Description^ | ||
- | |onPaging|pgButton|This event fires after click on [page button] and before populating the data. Also works when the user enters a new page number in the page input box (and presses [Enter]) and when the number of requested records is changed via the select box. To this event we pass only one parameter //pgButton// (string) which can be - //first,last,prev,next// in case of button click, //records// in case when a number of requested rows is changed and //user// when the user change the number of the requested page.| | + | |onPaging|pgButton|This event fires after click on [page button] and before populating the data. Also works when the user enters a new page number in the page input box (and presses [Enter]) and when the number of requested records is changed via the select box. To this event we pass only one parameter //pgButton// (string) which can be - //first,last,prev,next// in case of button click, //records// in case when a number of requested rows is changed and //user// when the user change the number of the requested page. If the string //stop// is returned from the function then the paging will be stopped.| |
+ | |||