1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
4 <meta http-equiv="Content-type" content="text/html; charset=utf-8">
5 <title>Namespace: ext - documentation</title>
7 <style type="text/css" media="screen">
8 @import "media/css/doc.css";
9 @import "media/css/shCore.css";
10 @import "media/css/shThemeDataTables.css";
13 <script type="text/javascript" src="media/js/shCore.js"></script>
14 <script type="text/javascript" src="media/js/shBrushJScript.js"></script>
15 <script type="text/javascript" src="media/js/jquery.js"></script>
16 <script type="text/javascript" src="media/js/doc.js"></script>
19 <div class="fw_container">
22 <div class="fw_header">
23 <h1 class="page-title">Namespace: ext</h1>
24 <h2 class="ancestors">Ancestry: <span class="ancestors"><a href="DataTable.html">DataTable</a> » <a href="DataTable.models.html">.models</a>.</span> » ext</h2>
25 <div class="page-info">
26 DataTables v1.9.4 documentation
35 <li><a href="#top">Overview</a></li>
36 <li><a href="#summary">Summary</a><div><table cellpadding="5" border="0" cellspacing="0" width="100%"><tbody><tr><td>Classes (0)</td><td>Namespaces (0)</td></tr><tr><td>Properties (0)</td><td><a href="#summary_properties_static">Static properties (14)</a></td></tr><tr><td>Methods (0)</td><td>Static methods (0)</td></tr><tr><td>Events (0)</td><td></td></tr></tbody></table></div></li><li><a href="#details">Details</a><div><table cellpadding="5" border="0" cellspacing="0" width="100%"><tbody><tr><td>Properties (0)</td><td><a href="#summary_properties_static">Static properties (14)</a></td></tr><tr><td>Methods (0)</td><td>Static methods (0)</td></tr><tr><td>Events (0)</td><td></td></tr></tbody></table></div></li></ul>
37 <div style="margin-top: 10px;">
38 <input type="hidden" name="show_private" value="0">
39 <span id="private_label">Hiding</span> private elements
40 (<a id="private_toggle" href="">toggle</a>)
44 <input type="hidden" name="show_extended" value="1">
45 <span id="extended_label">Showing</span> extended elements
46 (<a id="extended_toggle" href="">toggle</a>)
51 <div class="fw_content">
52 <a name="overview"></a>
53 <div class="doc_overview">
54 <div class="nav_blocker"></div>
55 <p>DataTables extension options and plug-ins. This namespace acts as a collection "area"
56 for plug-ins that can be used to extend the default DataTables behaviour - indeed many
57 of the build in methods use this method to provide their own capabilities (sorting methods
60 <p>Note that this namespace is aliased to jQuery.fn.dataTableExt so it can be readily accessed
61 and modified by plug-ins.</p><dl class="details">
68 <div class="doc_summary">
69 <a name="summary"></a>
72 <div class="doc_group"><a name="summary_properties_static"></a><h3 class="subsection-title">Properties - static</h3>
75 <dt class=" even"><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#afnFiltering">afnFiltering</a></span><span class="type-sig"><span class="type-signature"> :array</span></span></dt><dd class=" even"><p>Plug-in filtering functions - this method of filtering is complimentary to the default
76 type based filtering, and a lot more comprehensive as it allows you complete control
77 over the filtering logic. Each element in this array is a function (parameters
78 described below) that is called for every row in the table, and your logic decides if
79 it should be included in the filtered data set or not.
82 Function input parameters:
84 <li>{object} DataTables settings object: see <a href="DataTable.models.oSettings.html">DataTable.models.oSettings</a>.</li>
85 <li>{array|object} Data for the row to be processed (same as the original format
86 that was passed in as the data source, or an array from a DOM data source</li>
87 <li>{int} Row index in aoData (<a href="DataTable.models.oSettings.html#aoData">DataTable.models.oSettings.aoData</a>), which can
88 be useful to retrieve the TR element if you need DOM interaction.</li>
94 <li>{boolean} Include the row in the filtered result set (true) or not (false)</li>
97 </ul></p></dd><dt class=" odd"><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#afnSortData">afnSortData</a></span><span class="type-sig"><span class="type-signature"> :array</span></span></dt><dd class=" odd"><p>Plug-in sorting functions - this method of sorting is complimentary to the default type
98 based sorting that DataTables does automatically, allowing much greater control over the
99 the data that is being used to sort a column. This is useful if you want to do sorting
100 based on live data (for example the contents of an 'input' element) rather than just the
101 static string that DataTables knows of. The way these plug-ins work is that you create
102 an array of the values you wish to be sorted for the column in question and then return
103 that array. Which pre-sorting function is run here depends on the sSortDataType parameter
104 that is used for the column (if any). This is the corollary of <i>ofnSearch</i> for sort
108 Function input parameters:
110 <li>{object} DataTables settings object: see <a href="DataTable.models.oSettings.html">DataTable.models.oSettings</a>.</li>
111 <li>{int} Target column index</li>
117 <li>{array} Data for the column to be sorted upon</li>
120 </ul> [<a href-"#afnSortData">...</a>] </p></dd><dt class=" even"><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#aoFeatures">aoFeatures</a></span><span class="type-sig"><span class="type-signature"> :array</span></span></dt><dd class=" even"><p>Feature plug-ins - This is an array of objects which describe the feature plug-ins that are
121 available to DataTables. These feature plug-ins are accessible through the sDom initialisation
122 option. As such, each feature plug-in must describe a function that is used to initialise
123 itself (fnInit), a character so the feature can be enabled by sDom (cFeature) and the name
124 of the feature (sFeature). Thus the objects attached to this method must provide:
126 <li>{function} fnInit Initialisation of the plug-in
129 Function input parameters:
131 <li>{object} DataTables settings object: see <a href="DataTable.models.oSettings.html">DataTable.models.oSettings</a>.</li>
137 <li>{node|null} The element which contains your feature. Note that the return
138 may also be void if your plug-in does not require to inject any DOM elements
139 into DataTables control (sDom) - for example this might be useful when
140 developing a plug-in which allows table control via keyboard entry.</li>
145 <li>{character} cFeature Character that will be matched in sDom - case sensitive</li>
146 <li>{string} sFeature Feature name</li>
147 </ul></p></dd><dt class=" odd"><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#aTypes">aTypes</a></span><span class="type-sig"><span class="type-signature"> :array</span></span></dt><dd class=" odd"><p>Type detection plug-in functions - DataTables utilises types to define how sorting and
148 filtering behave, and types can be either be defined by the developer (sType for the
149 column) or they can be automatically detected by the methods in this array. The functions
150 defined in the array are quite simple, taking a single parameter (the data to analyse)
151 and returning the type if it is a known type, or null otherwise.
154 Function input parameters:
156 <li>{*} Data from the column cell to be analysed</li>
162 <li>{string|null} Data type detected, or null if unknown (and thus pass it
163 on to the other type detection functions.</li>
166 </ul></p></dd><dt class=" even"><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#fnVersionCheck">fnVersionCheck</a></span><span class="type-sig"><span class="type-signature"> :function</span></span></dt><dd class=" even"><p>Provide a common method for plug-ins to check the version of DataTables being used,
167 in order to ensure compatibility.</p></dd><dt class=" odd"><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#iApiIndex">iApiIndex</a></span><span class="type-sig"><span class="type-signature"> :int</span></span></dt><dd class=" odd"><p>Index for what 'this' index API functions should use</p></dd><dt class=" even"><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#oApi">oApi</a></span><span class="type-sig"><span class="type-signature"> :object</span></span></dt><dd class=" even"><p>Container for all private functions in DataTables so they can be exposed externally</p></dd><dt class=" odd"><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#ofnSearch">ofnSearch</a></span><span class="type-sig"><span class="type-signature"> :object</span></span></dt><dd class=" odd"><p>Pre-processing of filtering data plug-ins - When you assign the sType for a column
168 (or have it automatically detected for you by DataTables or a type detection plug-in),
169 you will typically be using this for custom sorting, but it can also be used to provide
170 custom filtering by allowing you to pre-processing the data and returning the data in
171 the format that should be filtered upon. This is done by adding functions this object
172 with a parameter name which matches the sType for that target column. This is the
173 corollary of <i>afnSortData</i> for filtering data.
176 Function input parameters:
178 <li>{*} Data from the column cell to be prepared for filtering</li>
184 <li>{string|null} Formatted string that will be used for the filtering.</li>
187 </ul> [<a href-"#ofnSearch">...</a>] </p></dd><dt class=" even"><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#oJUIClasses">oJUIClasses</a></span><span class="type-sig"><span class="type-signature"> :object</span></span></dt><dd class=" even"><p>Storage for the various classes that DataTables uses - jQuery UI suitable</p></dd><dt class=" odd"><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#oPagination">oPagination</a></span><span class="type-sig"><span class="type-signature"> :object</span></span></dt><dd class=" odd"><p>Pagination plug-in methods - The style and controls of the pagination can significantly
188 impact on how the end user interacts with the data in your table, and DataTables allows
189 the addition of pagination controls by extending this object, which can then be enabled
190 through the <i>sPaginationType</i> initialisation parameter. Each pagination type that
191 is added is an object (the property name of which is what <i>sPaginationType</i> refers
192 to) that has two properties, both methods that are used by DataTables to update the
196 fnInit - Initialisation of the paging controls. Called only during initialisation
197 of the table. It is expected that this function will add the required DOM elements
198 to the page for the paging controls to work. The element pointer
199 'oSettings.aanFeatures.p' array is provided by DataTables to contain the paging
200 controls (note that this is a 2D array to allow for multiple instances of each
201 DataTables DOM element). It is suggested that you add the controls to this element
205 Function input parameters:
207 <li>{object} DataTables settings object: see <a href="DataTable.models.oSettings.html">DataTable.models.oSettings</a>.</li>
208 <li>{node} Container into which the pagination controls must be inserted</li>
209 <li>{function} Draw callback function - whenever the controls cause a page
210 change, this method must be called to redraw the table.</li>
216 <li>No return required</li>
222 fnInit - This function is called whenever the paging status of the table changes and is
223 typically used to update classes and/or text of the paging controls to reflex the new
227 Function input parameters:
229 <li>{object} DataTables settings object: see <a href="DataTable.models.oSettings.html">DataTable.models.oSettings</a>.</li>
230 <li>{function} Draw callback function - in case you need to redraw the table again
231 or attach new event listeners</li>
237 <li>No return required</li>
242 </ul></p></dd><dt class=" even"><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#oSort">oSort</a></span><span class="type-sig"><span class="type-signature"> :object</span></span></dt><dd class=" even"><p>Sorting plug-in methods - Sorting in DataTables is based on the detected type of the
243 data column (you can add your own type detection functions, or override automatic
244 detection using sType). With this specific type given to the column, DataTables will
245 apply the required sort from the functions in the object. Each sort type must provide
246 two mandatory methods, one each for ascending and descending sorting, and can optionally
247 provide a pre-formatting method that will help speed up sorting by allowing DataTables
248 to pre-format the sort data only once (rather than every time the actual sort functions
249 are run). The two sorting functions are typical Javascript sort methods:
252 Function input parameters:
254 <li>{<em>} Data to compare to the second parameter</li>
255 <li>{</em>} Data to compare to the first parameter</li>
261 <li>{int} Sorting match: <0 if first parameter should be sorted lower than
262 the second parameter, ===0 if the two parameters are equal and >0 if
263 the first parameter should be sorted height than the second parameter.</li>
266 </ul></p></dd><dt class=" odd"><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#oStdClasses">oStdClasses</a></span><span class="type-sig"><span class="type-signature"> :object</span></span></dt><dd class=" odd"><p>Storage for the various classes that DataTables uses</p></dd><dt class=" even"><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#sErrMode">sErrMode</a></span><span class="type-sig"><span class="type-signature"> :string</span></span></dt><dd class=" even"><p>How should DataTables report an error. Can take the value 'alert' or 'throw'</p></dd><dt class=" odd"><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#sVersion">sVersion</a></span><span class="type-sig"><span class="type-signature"> :string</span></span></dt><dd class=" odd"><p>Version string for plug-ins to check compatibility. Allowed format is
267 a.b.c.d.e where: a:int, b:int, c:int, d:string(dev|beta), e:int. d and
268 e are optional</p></dd>
275 <div class="doc_details">
276 <a name="details"></a>
278 <div class="doc_group"><a name="details_properties"></a><h3 class="subsection-title">Properties - static</h3>
280 <dt class=" even"><a name="afnFiltering"></a><a name="afnFiltering_details"></a><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#afnFiltering">afnFiltering</a></span><span class="type-sig"><span class="type-signature"> :array</span></span></dt><dd class=" even"><p>Plug-in filtering functions - this method of filtering is complimentary to the default
281 type based filtering, and a lot more comprehensive as it allows you complete control
282 over the filtering logic. Each element in this array is a function (parameters
283 described below) that is called for every row in the table, and your logic decides if
284 it should be included in the filtered data set or not.
287 Function input parameters:
289 <li>{object} DataTables settings object: see <a href="DataTable.models.oSettings.html">DataTable.models.oSettings</a>.</li>
290 <li>{array|object} Data for the row to be processed (same as the original format
291 that was passed in as the data source, or an array from a DOM data source</li>
292 <li>{int} Row index in aoData (<a href="DataTable.models.oSettings.html#aoData">DataTable.models.oSettings.aoData</a>), which can
293 be useful to retrieve the TR element if you need DOM interaction.</li>
299 <li>{boolean} Include the row in the filtered result set (true) or not (false)</li>
302 </ul></p><div class="collapse_details"><dl class="details">
306 <div class="example-code">
307 <pre class="brush: js"> // The following example shows custom filtering being applied to the fourth column (i.e.
308 // the aData[3] index) based on two input values from the end-user, matching the data in
310 $.fn.dataTableExt.afnFiltering.push(
311 function( oSettings, aData, iDataIndex ) {
312 var iMin = document.getElementById('min').value * 1;
313 var iMax = document.getElementById('max').value * 1;
314 var iVersion = aData[3] == "-" ? 0 : aData[3]*1;
315 if ( iMin == "" && iMax == "" ) {
318 else if ( iMin == "" && iVersion < iMax ) {
321 else if ( iMin < iVersion && "" == iMax ) {
324 else if ( iMin < iVersion && iVersion < iMax ) {
331 </div></dd><dt class=" odd"><a name="afnSortData"></a><a name="afnSortData_details"></a><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#afnSortData">afnSortData</a></span><span class="type-sig"><span class="type-signature"> :array</span></span></dt><dd class=" odd"><p>Plug-in sorting functions - this method of sorting is complimentary to the default type
332 based sorting that DataTables does automatically, allowing much greater control over the
333 the data that is being used to sort a column. This is useful if you want to do sorting
334 based on live data (for example the contents of an 'input' element) rather than just the
335 static string that DataTables knows of. The way these plug-ins work is that you create
336 an array of the values you wish to be sorted for the column in question and then return
337 that array. Which pre-sorting function is run here depends on the sSortDataType parameter
338 that is used for the column (if any). This is the corollary of <i>ofnSearch</i> for sort
342 Function input parameters:
344 <li>{object} DataTables settings object: see <a href="DataTable.models.oSettings.html">DataTable.models.oSettings</a>.</li>
345 <li>{int} Target column index</li>
351 <li>{array} Data for the column to be sorted upon</li>
356 <p>Note that as of v1.9, it is typically preferable to use <i>mData</i> to prepare data for
357 the different uses that DataTables can put the data to. Specifically <i>mData</i> when
358 used as a function will give you a 'type' (sorting, filtering etc) that you can use to
359 prepare the data as required for the different types. As such, this method is deprecated.</p><div class="collapse_details"><dl class="details">
360 <dt class="important">Deprecated</dt><dd class="yes-def">Yes</dd>
363 <div class="example-code">
364 <pre class="brush: js"> // Updating the cached sorting information with user entered values in HTML input elements
365 jQuery.fn.dataTableExt.afnSortData['dom-text'] = function ( oSettings, iColumn )
368 $( 'td:eq('+iColumn+') input', oSettings.oApi._fnGetTrNodes(oSettings) ).each( function () {
369 aData.push( this.value );
374 </div></dd><dt class=" even"><a name="aoFeatures"></a><a name="aoFeatures_details"></a><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#aoFeatures">aoFeatures</a></span><span class="type-sig"><span class="type-signature"> :array</span></span></dt><dd class=" even"><p>Feature plug-ins - This is an array of objects which describe the feature plug-ins that are
375 available to DataTables. These feature plug-ins are accessible through the sDom initialisation
376 option. As such, each feature plug-in must describe a function that is used to initialise
377 itself (fnInit), a character so the feature can be enabled by sDom (cFeature) and the name
378 of the feature (sFeature). Thus the objects attached to this method must provide:
380 <li>{function} fnInit Initialisation of the plug-in
383 Function input parameters:
385 <li>{object} DataTables settings object: see <a href="DataTable.models.oSettings.html">DataTable.models.oSettings</a>.</li>
391 <li>{node|null} The element which contains your feature. Note that the return
392 may also be void if your plug-in does not require to inject any DOM elements
393 into DataTables control (sDom) - for example this might be useful when
394 developing a plug-in which allows table control via keyboard entry.</li>
399 <li>{character} cFeature Character that will be matched in sDom - case sensitive</li>
400 <li>{string} sFeature Feature name</li>
401 </ul></p><div class="collapse_details"><dl class="details">
405 <div class="example-code">
406 <pre class="brush: js"> // How TableTools initialises itself.
407 $.fn.dataTableExt.aoFeatures.push( {
408 "fnInit": function( oSettings ) {
409 return new TableTools( { "oDTSettings": oSettings } );
412 "sFeature": "TableTools"
415 </div></dd><dt class=" odd"><a name="aTypes"></a><a name="aTypes_details"></a><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#aTypes">aTypes</a></span><span class="type-sig"><span class="type-signature"> :array</span></span></dt><dd class=" odd"><p>Type detection plug-in functions - DataTables utilises types to define how sorting and
416 filtering behave, and types can be either be defined by the developer (sType for the
417 column) or they can be automatically detected by the methods in this array. The functions
418 defined in the array are quite simple, taking a single parameter (the data to analyse)
419 and returning the type if it is a known type, or null otherwise.
422 Function input parameters:
424 <li>{*} Data from the column cell to be analysed</li>
430 <li>{string|null} Data type detected, or null if unknown (and thus pass it
431 on to the other type detection functions.</li>
434 </ul></p><div class="collapse_details"><dl class="details">
438 <div class="example-code">
439 <pre class="brush: js"> // Currency type detection plug-in:
440 jQuery.fn.dataTableExt.aTypes.push(
442 var sValidChars = "0123456789.-";
445 // Check the numeric part
446 for ( i=1 ; i<sData.length ; i++ ) {
447 Char = sData.charAt(i);
448 if (sValidChars.indexOf(Char) == -1) {
453 // Check prefixed by currency
454 if ( sData.charAt(0) == '$' || sData.charAt(0) == '£' ) {
461 </div></dd><dt id="DataTable.models.ext.fnVersionCheck" class=" even"><a name="fnVersionCheck"></a><a name="fnVersionCheck_details"></a><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a>fnVersionCheck</a></span><span class="type-sig"><span class="type-signature"> :function</span></span></span></dt><dd class=" even"><p>Provide a common method for plug-ins to check the version of DataTables being used,
462 in order to ensure compatibility.</p><div class="collapse_details"><dl class="details">
467 <table class="params">
471 <th width="12%" class="bottom_border name">Name</th>
472 <th width="10%" class="bottom_border">Type</th>
473 <th width="10%" class="bottom_border">Attributes</th>
474 <th width="10%" class="bottom_border">Default</th>
475 <th class="last bottom_border">Description</th>
480 <tr class="even"><td class="number right_border"><div>1</div></td><td class="name">sVersion</td><td class="type type-param">string</td><td class="attributes"></td><td class="default"></td><td class="description last"><p>Version string to check for, in the format "X.Y.Z". Note
481 that the formats "X" and "X.Y" are also acceptable.</p></td></tr>
483 </table><h5>Returns:</h5><p class="returns"><p>true if this version of DataTables is greater or equal to the
484 required version, or false if this version of DataTales is not suitable</p></p><h5>Example:</h5>
485 <div class="example-code">
486 <pre class="brush: js"> $(document).ready(function() {
487 var oTable = $('#example').dataTable();
488 alert( oTable.fnVersionCheck( '1.9.0' ) );
492 <dt class=" odd"><a name="iApiIndex"></a><a name="iApiIndex_details"></a><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#iApiIndex">iApiIndex</a></span><span class="type-sig"><span class="type-signature"> :int</span></span></dt><dd class=" odd"><p>Index for what 'this' index API functions should use</p><div class="collapse_details"><dl class="details">
495 </div></dd><dt class=" even"><a name="oApi"></a><a name="oApi_details"></a><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#oApi">oApi</a></span><span class="type-sig"><span class="type-signature"> :object</span></span></dt><dd class=" even"><p>Container for all private functions in DataTables so they can be exposed externally</p><div class="collapse_details"><dl class="details">
498 </div></dd><dt class=" odd"><a name="ofnSearch"></a><a name="ofnSearch_details"></a><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#ofnSearch">ofnSearch</a></span><span class="type-sig"><span class="type-signature"> :object</span></span></dt><dd class=" odd"><p>Pre-processing of filtering data plug-ins - When you assign the sType for a column
499 (or have it automatically detected for you by DataTables or a type detection plug-in),
500 you will typically be using this for custom sorting, but it can also be used to provide
501 custom filtering by allowing you to pre-processing the data and returning the data in
502 the format that should be filtered upon. This is done by adding functions this object
503 with a parameter name which matches the sType for that target column. This is the
504 corollary of <i>afnSortData</i> for filtering data.
507 Function input parameters:
509 <li>{*} Data from the column cell to be prepared for filtering</li>
515 <li>{string|null} Formatted string that will be used for the filtering.</li>
520 <p>Note that as of v1.9, it is typically preferable to use <i>mData</i> to prepare data for
521 the different uses that DataTables can put the data to. Specifically <i>mData</i> when
522 used as a function will give you a 'type' (sorting, filtering etc) that you can use to
523 prepare the data as required for the different types. As such, this method is deprecated.</p><div class="collapse_details"><dl class="details">
524 <dt class="important">Deprecated</dt><dd class="yes-def">Yes</dd>
527 <div class="example-code">
528 <pre class="brush: js"> $.fn.dataTableExt.ofnSearch['title-numeric'] = function ( sData ) {
529 return sData.replace(/\n/g," ").replace( /<.*?>/g, "" );
532 </div></dd><dt class=" even"><a name="oJUIClasses"></a><a name="oJUIClasses_details"></a><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#oJUIClasses">oJUIClasses</a></span><span class="type-sig"><span class="type-signature"> :object</span></span></dt><dd class=" even"><p>Storage for the various classes that DataTables uses - jQuery UI suitable</p><div class="collapse_details"><dl class="details">
535 </div></dd><dt class=" odd"><a name="oPagination"></a><a name="oPagination_details"></a><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#oPagination">oPagination</a></span><span class="type-sig"><span class="type-signature"> :object</span></span></dt><dd class=" odd"><p>Pagination plug-in methods - The style and controls of the pagination can significantly
536 impact on how the end user interacts with the data in your table, and DataTables allows
537 the addition of pagination controls by extending this object, which can then be enabled
538 through the <i>sPaginationType</i> initialisation parameter. Each pagination type that
539 is added is an object (the property name of which is what <i>sPaginationType</i> refers
540 to) that has two properties, both methods that are used by DataTables to update the
544 fnInit - Initialisation of the paging controls. Called only during initialisation
545 of the table. It is expected that this function will add the required DOM elements
546 to the page for the paging controls to work. The element pointer
547 'oSettings.aanFeatures.p' array is provided by DataTables to contain the paging
548 controls (note that this is a 2D array to allow for multiple instances of each
549 DataTables DOM element). It is suggested that you add the controls to this element
553 Function input parameters:
555 <li>{object} DataTables settings object: see <a href="DataTable.models.oSettings.html">DataTable.models.oSettings</a>.</li>
556 <li>{node} Container into which the pagination controls must be inserted</li>
557 <li>{function} Draw callback function - whenever the controls cause a page
558 change, this method must be called to redraw the table.</li>
564 <li>No return required</li>
570 fnInit - This function is called whenever the paging status of the table changes and is
571 typically used to update classes and/or text of the paging controls to reflex the new
575 Function input parameters:
577 <li>{object} DataTables settings object: see <a href="DataTable.models.oSettings.html">DataTable.models.oSettings</a>.</li>
578 <li>{function} Draw callback function - in case you need to redraw the table again
579 or attach new event listeners</li>
585 <li>No return required</li>
590 </ul></p><div class="collapse_details"><dl class="details">
594 <div class="example-code">
595 <pre class="brush: js"> $.fn.dataTableExt.oPagination.four_button = {
596 "fnInit": function ( oSettings, nPaging, fnCallbackDraw ) {
597 nFirst = document.createElement( 'span' );
598 nPrevious = document.createElement( 'span' );
599 nNext = document.createElement( 'span' );
600 nLast = document.createElement( 'span' );
602 nFirst.appendChild( document.createTextNode( oSettings.oLanguage.oPaginate.sFirst ) );
603 nPrevious.appendChild( document.createTextNode( oSettings.oLanguage.oPaginate.sPrevious ) );
604 nNext.appendChild( document.createTextNode( oSettings.oLanguage.oPaginate.sNext ) );
605 nLast.appendChild( document.createTextNode( oSettings.oLanguage.oPaginate.sLast ) );
607 nFirst.className = "paginate_button first";
608 nPrevious.className = "paginate_button previous";
609 nNext.className="paginate_button next";
610 nLast.className = "paginate_button last";
612 nPaging.appendChild( nFirst );
613 nPaging.appendChild( nPrevious );
614 nPaging.appendChild( nNext );
615 nPaging.appendChild( nLast );
617 $(nFirst).click( function () {
618 oSettings.oApi._fnPageChange( oSettings, "first" );
619 fnCallbackDraw( oSettings );
622 $(nPrevious).click( function() {
623 oSettings.oApi._fnPageChange( oSettings, "previous" );
624 fnCallbackDraw( oSettings );
627 $(nNext).click( function() {
628 oSettings.oApi._fnPageChange( oSettings, "next" );
629 fnCallbackDraw( oSettings );
632 $(nLast).click( function() {
633 oSettings.oApi._fnPageChange( oSettings, "last" );
634 fnCallbackDraw( oSettings );
637 $(nFirst).bind( 'selectstart', function () { return false; } );
638 $(nPrevious).bind( 'selectstart', function () { return false; } );
639 $(nNext).bind( 'selectstart', function () { return false; } );
640 $(nLast).bind( 'selectstart', function () { return false; } );
643 "fnUpdate": function ( oSettings, fnCallbackDraw ) {
644 if ( !oSettings.aanFeatures.p ) {
648 // Loop over each instance of the pager
649 var an = oSettings.aanFeatures.p;
650 for ( var i=0, iLen=an.length ; i<iLen ; i++ ) {
651 var buttons = an[i].getElementsByTagName('span');
652 if ( oSettings._iDisplayStart === 0 ) {
653 buttons[0].className = "paginate_disabled_previous";
654 buttons[1].className = "paginate_disabled_previous";
657 buttons[0].className = "paginate_enabled_previous";
658 buttons[1].className = "paginate_enabled_previous";
661 if ( oSettings.fnDisplayEnd() == oSettings.fnRecordsDisplay() ) {
662 buttons[2].className = "paginate_disabled_next";
663 buttons[3].className = "paginate_disabled_next";
666 buttons[2].className = "paginate_enabled_next";
667 buttons[3].className = "paginate_enabled_next";
673 </div></dd><dt class=" even"><a name="oSort"></a><a name="oSort_details"></a><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#oSort">oSort</a></span><span class="type-sig"><span class="type-signature"> :object</span></span></dt><dd class=" even"><p>Sorting plug-in methods - Sorting in DataTables is based on the detected type of the
674 data column (you can add your own type detection functions, or override automatic
675 detection using sType). With this specific type given to the column, DataTables will
676 apply the required sort from the functions in the object. Each sort type must provide
677 two mandatory methods, one each for ascending and descending sorting, and can optionally
678 provide a pre-formatting method that will help speed up sorting by allowing DataTables
679 to pre-format the sort data only once (rather than every time the actual sort functions
680 are run). The two sorting functions are typical Javascript sort methods:
683 Function input parameters:
685 <li>{<em>} Data to compare to the second parameter</li>
686 <li>{</em>} Data to compare to the first parameter</li>
692 <li>{int} Sorting match: <0 if first parameter should be sorted lower than
693 the second parameter, ===0 if the two parameters are equal and >0 if
694 the first parameter should be sorted height than the second parameter.</li>
697 </ul></p><div class="collapse_details"><dl class="details">
701 <div class="example-code">
702 <pre class="brush: js"> // Case-sensitive string sorting, with no pre-formatting method
703 $.extend( $.fn.dataTableExt.oSort, {
704 "string-case-asc": function(x,y) {
705 return ((x < y) ? -1 : ((x > y) ? 1 : 0));
707 "string-case-desc": function(x,y) {
708 return ((x < y) ? 1 : ((x > y) ? -1 : 0));
715 <div class="example-code">
716 <pre class="brush: js"> // Case-insensitive string sorting, with pre-formatting
717 $.extend( $.fn.dataTableExt.oSort, {
718 "string-pre": function(x) {
719 return x.toLowerCase();
721 "string-asc": function(x,y) {
722 return ((x < y) ? -1 : ((x > y) ? 1 : 0));
724 "string-desc": function(x,y) {
725 return ((x < y) ? 1 : ((x > y) ? -1 : 0));
729 </div></dd><dt class=" odd"><a name="oStdClasses"></a><a name="oStdClasses_details"></a><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#oStdClasses">oStdClasses</a></span><span class="type-sig"><span class="type-signature"> :object</span></span></dt><dd class=" odd"><p>Storage for the various classes that DataTables uses</p><div class="collapse_details"><dl class="details">
732 </div></dd><dt class=" even"><a name="sErrMode"></a><a name="sErrMode_details"></a><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#sErrMode">sErrMode</a></span><span class="type-sig"><span class="type-signature"> :string</span></span></dt><dd class=" even"><p>How should DataTables report an error. Can take the value 'alert' or 'throw'</p><div class="collapse_details"><dl class="details">
735 </div></dd><dt class=" odd"><a name="sVersion"></a><a name="sVersion_details"></a><span class="type-attr"><span class="type-signature"><static> </span></span><span class="type-name"><a href="#sVersion">sVersion</a></span><span class="type-sig"><span class="type-signature"> :string</span></span></dt><dd class=" odd"><p>Version string for plug-ins to check compatibility. Allowed format is
736 a.b.c.d.e where: a:int, b:int, c:int, d:string(dev|beta), e:int. d and
737 e are optional</p><div class="collapse_details"><dl class="details">
746 <div class="fw_footer">
747 DataTables: Copyright 2008-2012 Allan Jardine, all rights reserved<br>
749 Documentation generated by <a href="https://github.com/micmath/JSDoc">JSDoc 3</a> on
750 23th Sep 2012 - 14:27
751 with the <a href="http://datatables.net/">DataTables</a> template.