library-mirrors/tablesorter
1
0
Fork 0
mirror of https://github.com/Mottie/tablesorter.git synced 2024-11-15 23:54:22 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Docs: Add more details about using pager ajax options

Browse Source
This commit is contained in:
Mottie 2014-06-04 16:02:35 -05:00
parent 5aeae68774
commit 5bb688f9e8
1 changed files with 30 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
docs/index.html
View File

@ -2970,6 +2970,10 @@ $.extend($.tablesorter.themes.jui, {
Set this option to include a url template to use so that the pager plugin can interact with your database (v2.1; <span class="version updated">v2.9</span>).
<div class="collapsible">
<br>
The tags within the <code>ajaxUrl</code> string are optional. If do not want the user to change the page size, then you only need to include the page in this string:
<pre class="prettyprint lang-js">ajaxUrl: "http://mydatabase.com?start={page}"</pre>
If you need to send your server a page offset (actual starting record number), then you'll need to use the <a href="#pager-customajaxurl"><code>customAjaxUrl</code> option</a>.<br>
<br>
Here is an example of how to include the option, it should <em>always</em> be paired with an <code>ajaxProcessing</code> function:
<pre class="prettyprint lang-js">$(function(){
$("table")
@ -3035,7 +3039,26 @@ $.extend($.tablesorter.themes.jui, {
return url += '&amp;currntUrl=' + window.location.href;
}
});
});</pre></div>
});</pre>
In the following example, lets say your server needs a starting and ending record number instead of a page &amp; size parameter. Use this option as follows:
<pre class="prettyprint lang-js">$(function(){
$("table")
.tablesorter()
.tablesorterPager({
ajaxUrl: "http://mydatabase.com?{sortList:col}",
customAjaxUrl: function(table, url) {
var pager = table.config.pager,
start = pager.page * pager.size,
end = start + pager.size;
return url += '&amp;start=' + start + '&amp;end=' + end;
},
ajaxProcessing: function(data, table, xhr){
// do something with the ajax data
return [ total_rows, data ];
}
});
});</pre>
</div>
</td>
<td><a href="example-pager-ajax.html">Example</a></td>
</tr>
@ -3050,6 +3073,8 @@ $.extend($.tablesorter.themes.jui, {
<br>
The <code>ajaxObject</code> is completely customizable, except for the `url` setting which is processed using the pager's `ajaxUrl` and `customAjaxUrl` options.<br>
<br>
Your server does not need to return a JSON format, if you want to return pure HTML, set the dataType to <code>&quot;html&quot;</code> and modify the <code>ajaxProcessing</code> function to instead work with HTML; then return a jQuery object or apply the HTML to the table yourself.<br>
<br>
See all possible settings in the <a href="http://api.jquery.com/jQuery.ajax/#jQuery-ajax-settings">jQuery.ajax documentation</a>
<pre class="prettyprint lang-js">$(function(){
$("table")
@ -3089,6 +3114,10 @@ $.extend($.tablesorter.themes.jui, {
This function is required to return the ajax data obtained from your server into a useable format for tablesorter to apply to the table (v2.1, <span class="version updated">v2.14.3</span>).
<div class="collapsible">
<br>
This function was created and modified to allow you a great deal of flexibility. The only required information that this function needs to return is an array containing the total number of rows, which is needed to calculate total pages.<br>
<br>
There are numerous examples below. Choosing which one to use is left to you. For more information, please check out related questions on <a href="http://stackoverflow.com/search?q=%5Btablesorter%5D+ajaxProcessing">Stackoverflow</a>, in particular see <a href="http://stackoverflow.com/q/16783740/145346">this thread</a> about how to use the different ajax options together.<br>
<br>
In <span class="version">v2.10</span>, the returned rows is now optional. And it can either be an array of arrays or a jQuery object (not attached to the table)
<br>
Process your ajax data so that the following information is returned: