Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

New: The primary public interface for DataTables' initialisation opti…

…ons is now camel case parameters rather than the Hungarian notation that was used before. There are a number of reasons for doing this, the primary one being that the Hungarian notation used by DataTables is actively stopping people from using the library due to their aversion to using Hungarian notation. Without doubt the Hungarian notation used was a mistake (the reason it was used was that when DataTables was originally written, the company I worked for at the time required the use of Hungarian notation, and thus I was trained in it...).

Backwards compatibility issues: The main goal here (other than to use camel-case notation!) is to preserve backwards compatibility. Unfortunately this isn't 100% possible:
	- DataTable.defaults.columns has been renamed to be DataTable.defaults.column
		- Otherwise it conflicts with aoColumns in the defaults.

Without doubt this is going to be a long process - for example the unit tests and examples need to be completely updated for this change. The JSDoc comments have been updated, so the site should take care of itself for the most part, when released.

In terms of implementation, it is important to note that I have not broken backwards compatibility here - the way it is does is that the current defaults are retained, and a camel-case to Hungarian mapping is automatically generated and then applied to the objects given by the end user. This adds around 0.5K to the size of DataTables, but writing the mapping manually would require at least 3K, and changing DataTables wholesale to camel-case would utterly break backwards compatibility. This is the least 'evil' way to accomplish this. It is important to note that this is a step along the roadmap for DataTables - come v2 Hungarian notation will likely be dropped completely.

One important note to make about this mapping is that if you use camel-case DataTables will copy the value from the camel-case properties to their Hungarian counterparts, so you will end up with additional properties on your source object. As I say, this appears to be to be the least 'evil' option, although still not perfect itself. The challenges of working with legacy software and installs...!
  • Loading branch information...
commit a0455fa85881a14f64c99476bb814d28480ef5d2 1 parent 65cde4c
Allan Jardine authored
2  component.json
View
@@ -1,6 +1,6 @@
{
"name": "DataTables",
- "version": "1.9.4",
+ "version": "1.10.0.dev",
"main": [
"./media/js/jquery.dataTables.js",
"./media/css/jquery.dataTables.css",
4 examples/advanced_init/defaults.html
View
@@ -14,8 +14,8 @@
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
$.extend( $.fn.dataTable.defaults, {
- "bFilter": false,
- "bSort": false
+ "filter": false,
+ "sort": false
} );
$('#example').dataTable();
4 examples/advanced_init/language_file.html
View
@@ -14,8 +14,8 @@
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
$('#example').dataTable( {
- "oLanguage": {
- "sUrl": "../examples_support/de_DE.txt"
+ "language": {
+ "url": "../examples_support/de_DE.txt"
}
} );
} );
6 examples/basic_init/hidden_columns.html
View
@@ -14,9 +14,9 @@
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
$('#example').dataTable( {
- "aoColumnDefs": [
- { "bSearchable": false, "bVisible": false, "aTargets": [ 2 ] },
- { "bVisible": false, "aTargets": [ 3 ] }
+ "columnDefs": [
+ { "searchable": false, "visible": false, "targets": [ 2 ] },
+ { "visible": false, "targets": [ 3 ] }
] } );
} );
</script>
14 examples/basic_init/language.html
View
@@ -14,12 +14,12 @@
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
$('#example').dataTable( {
- "oLanguage": {
- "sLengthMenu": "Display _MENU_ records per page",
- "sZeroRecords": "Nothing found - sorry",
- "sInfo": "Showing _START_ to _END_ of _TOTAL_ records",
- "sInfoEmpty": "Showing 0 to 0 of 0 records",
- "sInfoFiltered": "(filtered from _MAX_ total records)"
+ "language": {
+ "lengthMenu": "Display _MENU_ records per page",
+ "zeroRecords": "Nothing found - sorry",
+ "info": "Showing _START_ to _END_ of _TOTAL_ records",
+ "infoEmpty": "Showing 0 to 0 of 0 records",
+ "infoFiltered": "(filtered from _MAX_ total records)"
}
} );
} );
@@ -463,7 +463,7 @@
<h1>Initialisation code</h1>
<pre class="brush: js;">$(document).ready(function() {
-$('#example').dataTable( {
+ $('#example').dataTable( {
"oLanguage": {
"sLengthMenu": "Display _MENU_ records per page",
"sZeroRecords": "Nothing found - sorry",
4 examples/basic_init/themes.html
View
@@ -15,8 +15,8 @@
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
oTable = $('#example').dataTable({
- "bJQueryUI": true,
- "sPaginationType": "full_numbers"
+ "jQueryUI": true,
+ "paginationType": "full_numbers"
});
} );
</script>
4 examples/basic_init/zero_config.html
View
@@ -13,7 +13,9 @@
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
- $('#example').dataTable();
+ $('#example').dataTable( {
+ bSort: false
+ } );
} );
</script>
</head>
28 examples/examples_support/de_DE.txt
View
@@ -1,17 +1,17 @@
{
- "sProcessing": "Bitte warten...",
- "sLengthMenu": "_MENU_ Einträge anzeigen",
- "sZeroRecords": "Keine Einträge vorhanden.",
- "sInfo": "_START_ bis _END_ von _TOTAL_ Einträgen",
- "sInfoEmpty": "0 bis 0 von 0 Einträgen",
- "sInfoFiltered": "(gefiltert von _MAX_ Einträgen)",
- "sInfoPostFix": "",
- "sSearch": "Suchen",
- "sUrl": "",
- "oPaginate": {
- "sFirst": "Erster",
- "sPrevious": "Zurück",
- "sNext": "Nächster",
- "sLast": "Letzter"
+ "processing": "Bitte warten...",
+ "lengthMenu": "_MENU_ Einträge anzeigen",
+ "zeroRecords": "Keine Einträge vorhanden.",
+ "info": "_START_ bis _END_ von _TOTAL_ Einträgen",
+ "infoEmpty": "0 bis 0 von 0 Einträgen",
+ "infoFiltered": "(gefiltert von _MAX_ Einträgen)",
+ "infoPostFix": "",
+ "search": "Suchen",
+ "url": "",
+ "paginate": {
+ "first": "Erster",
+ "previous": "Zurück",
+ "next": "Nächster",
+ "last": "Letzter"
}
}
1,421 media/js/jquery.dataTables.js
View
851 additions, 570 deletions not shown
5 media/src/DataTables.js
View
@@ -21,7 +21,7 @@
*/
/*jslint evil: true, undef: true, browser: true */
-/*globals $, jQuery,define,_fnExternApiFunc,_fnInitialise,_fnInitComplete,_fnLanguageCompat,_fnAddColumn,_fnColumnOptions,_fnAddData,_fnCreateTr,_fnGatherData,_fnBuildHead,_fnDrawHead,_fnDraw,_fnReDraw,_fnAjaxUpdate,_fnAjaxParameters,_fnAjaxUpdateDraw,_fnServerParams,_fnAddOptionsHtml,_fnFeatureHtmlTable,_fnScrollDraw,_fnAdjustColumnSizing,_fnFeatureHtmlFilter,_fnFilterComplete,_fnFilterCustom,_fnFilterColumn,_fnFilter,_fnBuildSearchArray,_fnBuildSearchRow,_fnFilterCreateSearch,_fnDataToSearch,_fnSort,_fnSortAttachListener,_fnSortingClasses,_fnFeatureHtmlPaginate,_fnPageChange,_fnFeatureHtmlInfo,_fnUpdateInfo,_fnFeatureHtmlLength,_fnFeatureHtmlProcessing,_fnProcessingDisplay,_fnVisibleToColumnIndex,_fnColumnIndexToVisible,_fnNodeToDataIndex,_fnVisbleColumns,_fnCalculateEnd,_fnConvertToWidth,_fnCalculateColumnWidths,_fnScrollingWidthAdjust,_fnGetWidestNode,_fnGetMaxLenString,_fnStringToCss,_fnDetectType,_fnSettingsFromNode,_fnGetDataMaster,_fnGetTrNodes,_fnGetTdNodes,_fnEscapeRegex,_fnDeleteIndex,_fnColumnOrdering,_fnLog,_fnClearTable,_fnSaveState,_fnLoadState,_fnCreateCookie,_fnReadCookie,_fnDetectHeader,_fnGetUniqueThs,_fnScrollBarWidth,_fnApplyToChildren,_fnMap,_fnGetRowData,_fnGetCellData,_fnSetCellData,_fnGetObjectDataFn,_fnSetObjectDataFn,_fnApplyColumnDefs,_fnBindAction,_fnCallbackReg,_fnCallbackFire,_fnJsonString,_fnNodeToColumnIndex,_fnInfoMacros,_fnBrowserDetect,_fnGetColumns*/
+/*globals $, jQuery,define,_fnExternApiFunc,_fnInitialise,_fnInitComplete,_fnLanguageCompat,_fnAddColumn,_fnColumnOptions,_fnAddData,_fnCreateTr,_fnGatherData,_fnBuildHead,_fnDrawHead,_fnDraw,_fnReDraw,_fnAjaxUpdate,_fnAjaxParameters,_fnAjaxUpdateDraw,_fnServerParams,_fnAddOptionsHtml,_fnFeatureHtmlTable,_fnScrollDraw,_fnAdjustColumnSizing,_fnFeatureHtmlFilter,_fnFilterComplete,_fnFilterCustom,_fnFilterColumn,_fnFilter,_fnBuildSearchArray,_fnBuildSearchRow,_fnFilterCreateSearch,_fnDataToSearch,_fnSort,_fnSortAttachListener,_fnSortingClasses,_fnFeatureHtmlPaginate,_fnPageChange,_fnFeatureHtmlInfo,_fnUpdateInfo,_fnFeatureHtmlLength,_fnFeatureHtmlProcessing,_fnProcessingDisplay,_fnVisibleToColumnIndex,_fnColumnIndexToVisible,_fnNodeToDataIndex,_fnVisbleColumns,_fnCalculateEnd,_fnConvertToWidth,_fnCalculateColumnWidths,_fnScrollingWidthAdjust,_fnGetWidestNode,_fnGetMaxLenString,_fnStringToCss,_fnDetectType,_fnSettingsFromNode,_fnGetDataMaster,_fnGetTrNodes,_fnGetTdNodes,_fnEscapeRegex,_fnDeleteIndex,_fnColumnOrdering,_fnLog,_fnClearTable,_fnSaveState,_fnLoadState,_fnCreateCookie,_fnReadCookie,_fnDetectHeader,_fnGetUniqueThs,_fnScrollBarWidth,_fnApplyToChildren,_fnMap,_fnGetRowData,_fnGetCellData,_fnSetCellData,_fnGetObjectDataFn,_fnSetObjectDataFn,_fnApplyColumnDefs,_fnBindAction,_fnCallbackReg,_fnCallbackFire,_fnJsonString,_fnNodeToColumnIndex,_fnInfoMacros,_fnBrowserDetect,_fnGetColumns,_fnHungarianMap,_fnCamelToHungarian*/
(/** @lends <global> */function( window, document, undefined ) {
@@ -43,6 +43,9 @@
}
(/** @lends <global> */function( $ ) {
"use strict";
+
+ require('core.compat.js');
+
/**
* DataTables is a plug-in for the jQuery Javascript library. It is a
* highly flexible tool, based upon the foundations of progressive
4 media/src/api/api.internal.js
View
@@ -113,7 +113,9 @@ this.oApi = {
"_fnNodeToColumnIndex": _fnNodeToColumnIndex,
"_fnInfoMacros": _fnInfoMacros,
"_fnBrowserDetect": _fnBrowserDetect,
- "_fnGetColumns": _fnGetColumns
+ "_fnGetColumns": _fnGetColumns,
+ "_fnHungarianMap": _fnHungarianMap,
+ "_fnCamelToHungarian": _fnCamelToHungarian
};
$.extend( DataTable.ext.oApi, this.oApi );
9 media/src/core/core.columns.js
View
@@ -8,7 +8,7 @@
*/
function _fnAddColumn( oSettings, nTh )
{
- var oDefaults = DataTable.defaults.columns;
+ var oDefaults = DataTable.defaults.column;
var iCol = oSettings.aoColumns.length;
var oCol = $.extend( {}, DataTable.models.oColumn, oDefaults, {
"sSortingClass": oSettings.oClasses.sSortable,
@@ -65,6 +65,9 @@ function _fnColumnOptions( oSettings, iCol, oOptions )
/* User specified column options */
if ( oOptions !== undefined && oOptions !== null )
{
+ // Map camel case parameters to their Hungarian counterparts
+ _fnCamelToHungarian( DataTable.defaults.column, oOptions );
+
/* Backwards compatibility for mDataProp */
if ( oOptions.mDataProp && !oOptions.mData )
{
@@ -294,8 +297,8 @@ function _fnApplyColumnDefs( oSettings, aoColDefs, aoCols, fn )
for ( i=aoColDefs.length-1 ; i>=0 ; i-- )
{
/* Each definition can target multiple columns, as it is an array */
- var aTargets = aoColDefs[i].aTargets;
- if ( !$.isArray( aTargets ) )
+ var aTargets = aoColDefs[i].targets || aoColDefs[i].aTargets;
+ if ( ! $.isArray( aTargets ) )
{
_fnLog( oSettings, 1, 'aTargets must be an array of targets, not a '+(typeof aTargets) );
}
100 media/src/core/core.compat.js
View
@@ -0,0 +1,100 @@
+
+
+/**
+ * Create a mapping object that allows camel case parameters to be looked up
+ * for their Hungarian counterparts. The mapping is stored in a private
+ * parameter called `_hungaianMap` which can be accessed on the source object.
+ * @param {object} o
+ * @memberof DataTable#oApi
+ */
+function _fnHungarianMap ( o )
+{
+ var
+ hungarian = 'a aa ao as b fn i m o s ',
+ match,
+ newKey,
+ map = {};
+
+ $.each( o, function (key, val) {
+ match = key.match(/^([^A-Z]+?)([A-Z])/);
+
+ if ( match && hungarian.indexOf(match[1]+' ') !== -1 )
+ {
+ newKey = key.replace( match[0], match[2].toLowerCase() );
+ map[ newKey ] = key;
+
+ if ( match[1] === 'o' )
+ {
+ _fnHungarianMap( o[key] );
+ }
+ }
+ } );
+
+ o._hungaianMap = map;
+}
+
+
+/**
+ * Convert from camel case parameters to Hungarian, based on a Hungarian map
+ * created by _fnHungarianMap.
+ * @param {object} src The model object which holds all parameters can has
+ * previously been run through `_fnHungarianMap`.
+ * @param {object} user The object to convert from camel case to Hungarian.
+ * @param {boolean} force When set to `true`, properties which already have a
+ * Hungarian value in the `user` object will be overwritten. Otherwise they
+ * won't be.
+ * @memberof DataTable#oApi
+ */
+function _fnCamelToHungarian ( src, user, force )
+{
+ if ( ! src._hungaianMap )
+ {
+ return;
+ }
+
+ var hungarianKey;
+
+ $.each( user, function (key, val) {
+ hungarianKey = src._hungaianMap[ key ];
+
+ if ( hungarianKey !== undefined && (force || user[hungarianKey] === undefined) )
+ {
+ user[hungarianKey] = user[ key ];
+
+ if ( hungarianKey.charAt(0) === 'o' )
+ {
+ _fnCamelToHungarian( src[hungarianKey], user[key] );
+ }
+ }
+ } );
+}
+
+
+/**
+ * Language compatibility - when certain options are given, and others aren't, we
+ * need to duplicate the values over, in order to provide backwards compatibility
+ * with older language files.
+ * @param {object} oSettings dataTables settings object
+ * @memberof DataTable#oApi
+ */
+function _fnLanguageCompat( oLanguage )
+{
+ var oDefaults = DataTable.defaults.oLanguage;
+
+ /* Backwards compatibility - if there is no sEmptyTable given, then use the same as
+ * sZeroRecords - assuming that is given.
+ */
+ if ( !oLanguage.sEmptyTable && oLanguage.sZeroRecords &&
+ oDefaults.sEmptyTable === "No data available in table" )
+ {
+ _fnMap( oLanguage, oLanguage, 'sZeroRecords', 'sEmptyTable' );
+ }
+
+ /* Likewise with loading records */
+ if ( !oLanguage.sLoadingRecords && oLanguage.sZeroRecords &&
+ oDefaults.sLoadingRecords === "Loading..." )
+ {
+ _fnMap( oLanguage, oLanguage, 'sZeroRecords', 'sLoadingRecords' );
+ }
+}
+
18 media/src/core/core.constructor.js
View
@@ -12,6 +12,17 @@ if ( this.nodeName.toLowerCase() != 'table' )
return;
}
+/* Convert the camel-case defaults to Hungarian */
+_fnCamelToHungarian( DataTable.defaults, DataTable.defaults, true );
+_fnCamelToHungarian( DataTable.defaults.column, DataTable.defaults.column, true );
+
+/* Setting up the initialisation object */
+if ( !oInit )
+{
+ oInit = {};
+}
+_fnCamelToHungarian( DataTable.defaults, oInit );
+
/* Check to see if we are re-initialising a table */
for ( i=0, iLen=DataTable.settings.length ; i<iLen ; i++ )
{
@@ -70,12 +81,6 @@ DataTable.settings.push( oSettings );
// to the settings array, so we can self reference the table instance if more than one
oSettings.oInstance = (_that.length===1) ? _that : $(this).dataTable();
-/* Setting up the initialisation object */
-if ( !oInit )
-{
- oInit = {};
-}
-
// Backwards compatibility, before we apply all the defaults
if ( oInit.oLanguage )
{
@@ -215,6 +220,7 @@ if ( oInit.oLanguage.sUrl !== "" )
oSettings.oLanguage.sUrl = oInit.oLanguage.sUrl;
$.getJSON( oSettings.oLanguage.sUrl, null, function( json ) {
_fnLanguageCompat( json );
+ _fnCamelToHungarian( DataTable.defaults.oLanguage, json );
$.extend( true, oSettings.oLanguage, oInit.oLanguage, json );
_fnInitialise( oSettings );
} );
29 media/src/core/core.init.js
View
@@ -122,32 +122,3 @@ function _fnInitComplete ( oSettings, json )
_fnCallbackFire( oSettings, 'aoInitComplete', 'init', [oSettings, json] );
}
-
-/**
- * Language compatibility - when certain options are given, and others aren't, we
- * need to duplicate the values over, in order to provide backwards compatibility
- * with older language files.
- * @param {object} oSettings dataTables settings object
- * @memberof DataTable#oApi
- */
-function _fnLanguageCompat( oLanguage )
-{
- var oDefaults = DataTable.defaults.oLanguage;
-
- /* Backwards compatibility - if there is no sEmptyTable given, then use the same as
- * sZeroRecords - assuming that is given.
- */
- if ( !oLanguage.sEmptyTable && oLanguage.sZeroRecords &&
- oDefaults.sEmptyTable === "No data available in table" )
- {
- _fnMap( oLanguage, oLanguage, 'sZeroRecords', 'sEmptyTable' );
- }
-
- /* Likewise with loading records */
- if ( !oLanguage.sLoadingRecords && oLanguage.sZeroRecords &&
- oDefaults.sLoadingRecords === "Loading..." )
- {
- _fnMap( oLanguage, oLanguage, 'sZeroRecords', 'sLoadingRecords' );
- }
-}
-
2  media/src/model/model.column.js
View
@@ -6,7 +6,7 @@
* is held in the settings aoColumns array and contains all the information that
* DataTables needs about each individual column.
*
- * Note that this object is related to {@link DataTable.defaults.columns}
+ * Note that this object is related to {@link DataTable.defaults.column}
* but this one is the internal data store for DataTables's cache of columns.
* It should NOT be manipulated outside of DataTables. Any configuration should
* be done through the initialisation options.
450 media/src/model/model.defaults.columns.js
View
@@ -1,38 +1,45 @@
+/*
+ * Developer note - See note in model.defaults.js about the use of Hungarian
+ * notation and camel case.
+ */
+
/**
* Column options that can be given to DataTables at initialisation time.
* @namespace
*/
-DataTable.defaults.columns = {
+DataTable.defaults.column = {
/**
* Allows a column's sorting to take multiple columns into account when
* doing a sort. For example first name / last name columns make sense to
* do a multi-column sort over the two columns.
* @type array
* @default null <i>Takes the value of the column index automatically</i>
+ *
+ * @name DataTable.defaults.column.dataSort
* @dtopt Columns
*
* @example
- * // Using aoColumnDefs
+ * // Using `columnDefs`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumnDefs": [
- * { "aDataSort": [ 0, 1 ], "aTargets": [ 0 ] },
- * { "aDataSort": [ 1, 0 ], "aTargets": [ 1 ] },
- * { "aDataSort": [ 2, 3, 4 ], "aTargets": [ 2 ] }
+ * "columnDefs": [
+ * { "dataSort": [ 0, 1 ], "targets": [ 0 ] },
+ * { "dataSort": [ 1, 0 ], "targets": [ 1 ] },
+ * { "dataSort": [ 2, 3, 4 ], "targets": [ 2 ] }
* ]
* } );
* } );
*
* @example
- * // Using aoColumns
+ * // Using `columns`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumns": [
- * { "aDataSort": [ 0, 1 ] },
- * { "aDataSort": [ 1, 0 ] },
- * { "aDataSort": [ 2, 3, 4 ] },
+ * "columns": [
+ * { "dataSort": [ 0, 1 ] },
+ * { "dataSort": [ 1, 0 ] },
+ * { "dataSort": [ 2, 3, 4 ] },
* null,
* null
* ]
@@ -48,29 +55,31 @@ DataTable.defaults.columns = {
* parameter.
* @type array
* @default [ 'asc', 'desc' ]
+ *
+ * @name DataTable.defaults.column.sorting
* @dtopt Columns
*
* @example
- * // Using aoColumnDefs
+ * // Using `columnDefs`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumnDefs": [
- * { "asSorting": [ "asc" ], "aTargets": [ 1 ] },
- * { "asSorting": [ "desc", "asc", "asc" ], "aTargets": [ 2 ] },
- * { "asSorting": [ "desc" ], "aTargets": [ 3 ] }
+ * "columnDefs": [
+ * { "sorting": [ "asc" ], "targets": [ 1 ] },
+ * { "sorting": [ "desc", "asc", "asc" ], "targets": [ 2 ] },
+ * { "sorting": [ "desc" ], "targets": [ 3 ] }
* ]
* } );
* } );
*
* @example
- * // Using aoColumns
+ * // Using `columns`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumns": [
+ * "columns": [
* null,
- * { "asSorting": [ "asc" ] },
- * { "asSorting": [ "desc", "asc", "asc" ] },
- * { "asSorting": [ "desc" ] },
+ * { "sorting": [ "asc" ] },
+ * { "sorting": [ "desc", "asc", "asc" ] },
+ * { "sorting": [ "desc" ] },
* null
* ]
* } );
@@ -83,23 +92,25 @@ DataTable.defaults.columns = {
* Enable or disable filtering on the data in this column.
* @type boolean
* @default true
+ *
+ * @name DataTable.defaults.column.searchable
* @dtopt Columns
*
* @example
- * // Using aoColumnDefs
+ * // Using `columnDefs`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumnDefs": [
- * { "bSearchable": false, "aTargets": [ 0 ] }
+ * "columnDefs": [
+ * { "searchable": false, "targets": [ 0 ] }
* ] } );
* } );
*
* @example
- * // Using aoColumns
+ * // Using `columns`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumns": [
- * { "bSearchable": false },
+ * "columns": [
+ * { "searchable": false },
* null,
* null,
* null,
@@ -114,23 +125,25 @@ DataTable.defaults.columns = {
* Enable or disable sorting on this column.
* @type boolean
* @default true
+ *
+ * @name DataTable.defaults.column.sortable
* @dtopt Columns
*
* @example
- * // Using aoColumnDefs
+ * // Using `columnDefs`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumnDefs": [
- * { "bSortable": false, "aTargets": [ 0 ] }
+ * "columnDefs": [
+ * { "sortable": false, "targets": [ 0 ] }
* ] } );
* } );
*
* @example
- * // Using aoColumns
+ * // Using `columns`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumns": [
- * { "bSortable": false },
+ * "columns": [
+ * { "sortable": false },
* null,
* null,
* null,
@@ -145,23 +158,25 @@ DataTable.defaults.columns = {
* Enable or disable the display of this column.
* @type boolean
* @default true
+ *
+ * @name DataTable.defaults.column.visible
* @dtopt Columns
*
* @example
- * // Using aoColumnDefs
+ * // Using `columnDefs`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumnDefs": [
- * { "bVisible": false, "aTargets": [ 0 ] }
+ * "columnDefs": [
+ * { "visible": false, "targets": [ 0 ] }
* ] } );
* } );
*
* @example
- * // Using aoColumns
+ * // Using `columns`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumns": [
- * { "bVisible": false },
+ * "columns": [
+ * { "visible": false },
* null,
* null,
* null,
@@ -178,21 +193,23 @@ DataTable.defaults.columns = {
* allowing you to modify the DOM element (add background colour for example) when the
* element is available.
* @type function
- * @param {element} nTd The TD node that has been created
- * @param {*} sData The Data for the cell
- * @param {array|object} oData The data for the whole row
- * @param {int} iRow The row index for the aoData data store
- * @param {int} iCol The column index for aoColumns
+ * @param {element} td The TD node that has been created
+ * @param {*} cellData The Data for the cell
+ * @param {array|object} rowData The data for the whole row
+ * @param {int} row The row index for the aoData data store
+ * @param {int} col The column index for aoColumns
+ *
+ * @name DataTable.defaults.column.createdCell
* @dtopt Columns
*
* @example
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumnDefs": [ {
- * "aTargets": [3],
- * "fnCreatedCell": function (nTd, sData, oData, iRow, iCol) {
- * if ( sData == "1.7" ) {
- * $(nTd).css('color', 'blue')
+ * "columnDefs": [ {
+ * "targets": [3],
+ * "createdCell": function (td, cellData, rowData, row, col) {
+ * if ( cellData == "1.7" ) {
+ * $(td).css('color', 'blue')
* }
* }
* } ]
@@ -208,24 +225,26 @@ DataTable.defaults.columns = {
* on hidden columns for example.
* @type int
* @default -1 <i>Use automatically calculated column index</i>
+ *
+ * @name DataTable.defaults.column.dataSort
* @dtopt Columns
*
* @example
- * // Using aoColumnDefs
+ * // Using `columnDefs`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumnDefs": [
- * { "iDataSort": 1, "aTargets": [ 0 ] }
+ * "columnDefs": [
+ * { "dataSort": 1, "targets": [ 0 ] }
* ]
* } );
* } );
*
* @example
- * // Using aoColumns
+ * // Using `columns`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumns": [
- * { "iDataSort": 1 },
+ * "columns": [
+ * { "dataSort": 1 },
* null,
* null,
* null,
@@ -238,75 +257,75 @@ DataTable.defaults.columns = {
/**
- * This parameter has been replaced by mData in DataTables to ensure naming
- * consistency. mDataProp can still be used, as there is backwards compatibility
+ * This parameter has been replaced by `data` in DataTables to ensure naming
+ * consistency. `dataProp` can still be used, as there is backwards compatibility
* in DataTables for this option, but it is strongly recommended that you use
- * mData in preference to mDataProp.
- * @name DataTable.defaults.columns.mDataProp
+ * `data` in preference to `dataProp`.
+ * @name DataTable.defaults.column.dataProp
*/
/**
* This property can be used to read data from any JSON data source property,
- * including deeply nested objects / properties. mData can be given in a
+ * including deeply nested objects / properties. `data` can be given in a
* number of different ways which effect its behaviour:
- * <ul>
- * <li>integer - treated as an array index for the data source. This is the
- * default that DataTables uses (incrementally increased for each column).</li>
- * <li>string - read an object property from the data source. Note that you can
- * use Javascript dotted notation to read deep properties / arrays from the
- * data source.</li>
- * <li>null - the sDefaultContent option will be used for the cell (null
- * by default, so you will need to specify the default content you want -
- * typically an empty string). This can be useful on generated columns such
- * as edit / delete action columns.</li>
- * <li>function - the function given will be executed whenever DataTables
- * needs to set or get the data for a cell in the column. The function
- * takes three parameters:
- * <ul>
- * <li>{array|object} The data source for the row</li>
- * <li>{string} The type call data requested - this will be 'set' when
- * setting data or 'filter', 'display', 'type', 'sort' or undefined when
- * gathering data. Note that when <i>undefined</i> is given for the type
- * DataTables expects to get the raw data for the object back</li>
- * <li>{*} Data to set when the second parameter is 'set'.</li>
- * </ul>
- * The return value from the function is not required when 'set' is the type
- * of call, but otherwise the return is what will be used for the data
- * requested.</li>
- * </ul>
*
- * Note that prior to DataTables 1.9.2 mData was called mDataProp. The name change
+ * * integer - treated as an array index for the data source. This is the
+ * default that DataTables uses (incrementally increased for each column).
+ * * string - read an object property from the data source. Note that you can
+ * use Javascript dotted notation to read deep properties / arrays from the
+ * data source.
+ * * null - the sDefaultContent option will be used for the cell (null
+ * by default, so you will need to specify the default content you want -
+ * typically an empty string). This can be useful on generated columns such
+ * as edit / delete action columns.
+ * * function - the function given will be executed whenever DataTables
+ * needs to set or get the data for a cell in the column. The function
+ * takes three parameters:
+ * * {array|object} The data source for the row
+ * * {string} The type call data requested - this will be 'set' when
+ * setting data or 'filter', 'display', 'type', 'sort' or undefined when
+ * gathering data. Note that when `undefined` is given for the type
+ * DataTables expects to get the raw data for the object back<
+ * * {*} Data to set when the second parameter is 'set'.
+ * * The return value from the function is not required when 'set' is the type
+ * of call, but otherwise the return is what will be used for the data
+ * requested.
+ *
+ * Note that prior to DataTables 1.9.2 `data` was called `mDataProp`. The name change
* reflects the flexibility of this property and is consistent with the naming of
* mRender. If 'mDataProp' is given, then it will still be used by DataTables, as
* it automatically maps the old name to the new if required.
+ *
* @type string|int|function|null
* @default null <i>Use automatically calculated column index</i>
+ *
+ * @name DataTable.defaults.column.data
* @dtopt Columns
*
* @example
* // Read table data from objects
* $(document).ready( function() {
- * var oTable = $('#example').dataTable( {
- * "sAjaxSource": "sources/deep.txt",
- * "aoColumns": [
- * { "mData": "engine" },
- * { "mData": "browser" },
- * { "mData": "platform.inner" },
- * { "mData": "platform.details.0" },
- * { "mData": "platform.details.1" }
+ * $('#example').dataTable( {
+ * "ajaxSource": "sources/deep.txt",
+ * "columns": [
+ * { "data": "engine" },
+ * { "data": "browser" },
+ * { "data": "platform.inner" },
+ * { "data": "platform.details.0" },
+ * { "data": "platform.details.1" }
* ]
* } );
* } );
*
* @example
- * // Using mData as a function to provide different information for
+ * // Using `data` as a function to provide different information for
* // sorting, filtering and display. In this case, currency (price)
* $(document).ready( function() {
- * var oTable = $('#example').dataTable( {
- * "aoColumnDefs": [ {
- * "aTargets": [ 0 ],
- * "mData": function ( source, type, val ) {
+ * $('#example').dataTable( {
+ * "columnDefs": [ {
+ * "targets": [ 0 ],
+ * "data": function ( source, type, val ) {
* if (type === 'set') {
* source.price = val;
* // Store the computed dislay and filter values for efficiency
@@ -331,51 +350,51 @@ DataTable.defaults.columns = {
/**
- * This property is the rendering partner to mData and it is suggested that
+ * This property is the rendering partner to `data` and it is suggested that
* when you want to manipulate data for display (including filtering, sorting etc)
- * but not altering the underlying data for the table, use this property. mData
+ * but not altering the underlying data for the table, use this property. `data`
* can actually do everything this property can and more, but this parameter is
- * easier to use since there is no 'set' option. Like mData is can be given
+ * easier to use since there is no 'set' option. Like `data` this can be given
* in a number of different ways to effect its behaviour, with the addition of
* supporting array syntax for easy outputting of arrays (including arrays of
* objects):
- * <ul>
- * <li>integer - treated as an array index for the data source. This is the
- * default that DataTables uses (incrementally increased for each column).</li>
- * <li>string - read an object property from the data source. Note that you can
- * use Javascript dotted notation to read deep properties / arrays from the
- * data source and also array brackets to indicate that the data reader should
- * loop over the data source array. When characters are given between the array
- * brackets, these characters are used to join the data source array together.
- * For example: "accounts[, ].name" would result in a comma separated list with
- * the 'name' value from the 'accounts' array of objects.</li>
- * <li>function - the function given will be executed whenever DataTables
- * needs to set or get the data for a cell in the column. The function
- * takes three parameters:
- * <ul>
- * <li>{array|object} The data source for the row (based on mData)</li>
- * <li>{string} The type call data requested - this will be 'filter', 'display',
- * 'type' or 'sort'.</li>
- * <li>{array|object} The full data source for the row (not based on mData)</li>
- * </ul>
- * The return value from the function is what will be used for the data
- * requested.</li>
- * </ul>
+ *
+ * * integer - treated as an array index for the data source. This is the
+ * default that DataTables uses (incrementally increased for each column).
+ * * string - read an object property from the data source. Note that you can
+ * use Javascript dotted notation to read deep properties / arrays from the
+ * data source and also array brackets to indicate that the data reader should
+ * loop over the data source array. When characters are given between the array
+ * brackets, these characters are used to join the data source array together.
+ * For example: "accounts[, ].name" would result in a comma separated list with
+ * the 'name' value from the 'accounts' array of objects.
+ * * function - the function given will be executed whenever DataTables
+ * needs to set or get the data for a cell in the column. The function
+ * takes three parameters:
+ * * {array|object} The data source for the row (based on `data`)
+ * * {string} The type call data requested - this will be 'filter', 'display',
+ * 'type' or 'sort'.
+ * * {array|object} The full data source for the row (not based on `data`)
+ * * The return value from the function is what will be used for the data
+ * requested.
+ *
* @type string|int|function|null
- * @default null <i>Use mData</i>
+ * @default null _Use `data`_
+ *
+ * @name DataTable.defaults.column.render
* @dtopt Columns
*
* @example
* // Create a comma separated list from an array of objects
* $(document).ready( function() {
- * var oTable = $('#example').dataTable( {
- * "sAjaxSource": "sources/deep.txt",
- * "aoColumns": [
- * { "mData": "engine" },
- * { "mData": "browser" },
+ * $('#example').dataTable( {
+ * "ajaxSource": "sources/deep.txt",
+ * "columns": [
+ * { "data": "engine" },
+ * { "data": "browser" },
* {
- * "mData": "platform",
- * "mRender": "[, ].name"
+ * "data": "platform",
+ * "render": "[, ].name"
* }
* ]
* } );
@@ -384,12 +403,12 @@ DataTable.defaults.columns = {
* @example
* // Use as a function to create a link from the data source
* $(document).ready( function() {
- * var oTable = $('#example').dataTable( {
- * "aoColumnDefs": [
+ * $('#example').dataTable( {
+ * "columnDefs": [
* {
- * "aTargets": [ 0 ],
- * "mData": "download_link",
- * "mRender": function ( data, type, full ) {
+ * "targets": [ 0 ],
+ * "data": "download_link",
+ * "render": function ( data, type, full ) {
* return '<a href="'+data+'">Download</a>';
* }
* ]
@@ -405,15 +424,17 @@ DataTable.defaults.columns = {
* to act as a header for a row (you may wish to add scope='row' to the TH elements).
* @type string
* @default td
+ *
+ * @name DataTable.defaults.column.cellType
* @dtopt Columns
*
* @example
* // Make the first column use TH cells
* $(document).ready( function() {
- * var oTable = $('#example').dataTable( {
- * "aoColumnDefs": [ {
- * "aTargets": [ 0 ],
- * "sCellType": "th"
+ * $('#example').dataTable( {
+ * "columnDefs": [ {
+ * "targets": [ 0 ],
+ * "cellType": "th"
* } ]
* } );
* } );
@@ -425,24 +446,26 @@ DataTable.defaults.columns = {
* Class to give to each cell in this column.
* @type string
* @default <i>Empty string</i>
+ *
+ * @name DataTable.defaults.column.class
* @dtopt Columns
*
* @example
- * // Using aoColumnDefs
+ * // Using `columnDefs`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumnDefs": [
- * { "sClass": "my_class", "aTargets": [ 0 ] }
+ * "columnDefs": [
+ * { "class": "my_class", "targets": [ 0 ] }
* ]
* } );
* } );
*
* @example
- * // Using aoColumns
+ * // Using `columns`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumns": [
- * { "sClass": "my_class" },
+ * "columns": [
+ * { "class": "my_class" },
* null,
* null,
* null,
@@ -462,22 +485,23 @@ DataTable.defaults.columns = {
* it into an DOM object and measuring that is horribly(!) slow). Thus as
* a "work around" we provide this option. It will append its value to the
* text that is found to be the longest string for the column - i.e. padding.
- * Generally you shouldn't need this, and it is not documented on the
- * general DataTables.net documentation
+ * Generally you shouldn't need this!
* @type string
* @default <i>Empty string<i>
+ *
+ * @name DataTable.defaults.column.contentPadding
* @dtopt Columns
*
* @example
- * // Using aoColumns
+ * // Using `columns`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumns": [
+ * "columns": [
* null,
* null,
* null,
* {
- * "sContentPadding": "mmm"
+ * "contentPadding": "mmm"
* }
* ]
* } );
@@ -488,37 +512,39 @@ DataTable.defaults.columns = {
/**
* Allows a default value to be given for a column's data, and will be used
- * whenever a null data source is encountered (this can be because mData
+ * whenever a null data source is encountered (this can be because `data`
* is set to null, or because the data source itself is null).
* @type string
* @default null
+ *
+ * @name DataTable.defaults.column.defaultContent
* @dtopt Columns
*
* @example
- * // Using aoColumnDefs
+ * // Using `columnDefs`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumnDefs": [
+ * "columnDefs": [
* {
- * "mData": null,
- * "sDefaultContent": "Edit",
- * "aTargets": [ -1 ]
+ * "data": null,
+ * "defaultContent": "Edit",
+ * "targets": [ -1 ]
* }
* ]
* } );
* } );
*
* @example
- * // Using aoColumns
+ * // Using `columns`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumns": [
+ * "columns": [
* null,
* null,
* null,
* {
- * "mData": null,
- * "sDefaultContent": "Edit"
+ * "data": null,
+ * "defaultContent": "Edit"
* }
* ]
* } );
@@ -536,32 +562,34 @@ DataTable.defaults.columns = {
* client-side, your server-side code does not also need updating).
* @type string
* @default <i>Empty string</i>
+ *
+ * @name DataTable.defaults.column.name
* @dtopt Columns
*
* @example
- * // Using aoColumnDefs
+ * // Using `columnDefs`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumnDefs": [
- * { "sName": "engine", "aTargets": [ 0 ] },
- * { "sName": "browser", "aTargets": [ 1 ] },
- * { "sName": "platform", "aTargets": [ 2 ] },
- * { "sName": "version", "aTargets": [ 3 ] },
- * { "sName": "grade", "aTargets": [ 4 ] }
+ * "columnDefs": [
+ * { "name": "engine", "targets": [ 0 ] },
+ * { "name": "browser", "targets": [ 1 ] },
+ * { "name": "platform", "targets": [ 2 ] },
+ * { "name": "version", "targets": [ 3 ] },
+ * { "name": "grade", "targets": [ 4 ] }
* ]
* } );
* } );
*
* @example
- * // Using aoColumns
+ * // Using `columns`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumns": [
- * { "sName": "engine" },
- * { "sName": "browser" },
- * { "sName": "platform" },
- * { "sName": "version" },
- * { "sName": "grade" }
+ * "columns": [
+ * { "name": "engine" },
+ * { "name": "browser" },
+ * { "name": "platform" },
+ * { "name": "version" },
+ * { "name": "grade" }
* ]
* } );
* } );
@@ -576,32 +604,34 @@ DataTable.defaults.columns = {
* elements such as form inputs.
* @type string
* @default std
+ *
+ * @name DataTable.defaults.column.sortDataType
* @dtopt Columns
*
* @example
- * // Using aoColumnDefs
+ * // Using `columnDefs`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumnDefs": [
- * { "sSortDataType": "dom-text", "aTargets": [ 2, 3 ] },
- * { "sType": "numeric", "aTargets": [ 3 ] },
- * { "sSortDataType": "dom-select", "aTargets": [ 4 ] },
- * { "sSortDataType": "dom-checkbox", "aTargets": [ 5 ] }
+ * "columnDefs": [
+ * { "sortDataType": "dom-text", "targets": [ 2, 3 ] },
+ * { "type": "numeric", "targets": [ 3 ] },
+ * { "sortDataType": "dom-select", "targets": [ 4 ] },
+ * { "sortDataType": "dom-checkbox", "targets": [ 5 ] }
* ]
* } );
* } );
*
* @example
- * // Using aoColumns
+ * // Using `columns`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumns": [
+ * "columns": [
* null,
* null,
- * { "sSortDataType": "dom-text" },
- * { "sSortDataType": "dom-text", "sType": "numeric" },
- * { "sSortDataType": "dom-select" },
- * { "sSortDataType": "dom-checkbox" }
+ * { "sortDataType": "dom-text" },
+ * { "sortDataType": "dom-text", "type": "numeric" },
+ * { "sortDataType": "dom-select" },
+ * { "sortDataType": "dom-checkbox" }
* ]
* } );
* } );
@@ -614,24 +644,26 @@ DataTable.defaults.columns = {
* @type string
* @default null <i>Derived from the 'TH' value for this column in the
* original HTML table.</i>
+ *
+ * @name DataTable.defaults.column.title
* @dtopt Columns
*
* @example
- * // Using aoColumnDefs
+ * // Using `columnDefs`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumnDefs": [
- * { "sTitle": "My column title", "aTargets": [ 0 ] }
+ * "columnDefs": [
+ * { "title": "My column title", "targets": [ 0 ] }
* ]
* } );
* } );
*
* @example
- * // Using aoColumns
+ * // Using `columns`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumns": [
- * { "sTitle": "My column title" },
+ * "columns": [
+ * { "title": "My column title" },
* null,
* null,
* null,
@@ -653,24 +685,26 @@ DataTable.defaults.columns = {
* plug-ins.
* @type string
* @default null <i>Auto-detected from raw data</i>
+ *
+ * @name DataTable.defaults.column.type
* @dtopt Columns
*
* @example
- * // Using aoColumnDefs
+ * // Using `columnDefs`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumnDefs": [
- * { "sType": "html", "aTargets": [ 0 ] }
+ * "columnDefs": [
+ * { "type": "html", "targets": [ 0 ] }
* ]
* } );
* } );
*
* @example
- * // Using aoColumns
+ * // Using `columns`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumns": [
- * { "sType": "html" },
+ * "columns": [
+ * { "type": "html" },
* null,
* null,
* null,
@@ -689,24 +723,26 @@ DataTable.defaults.columns = {
* remains readable.
* @type string
* @default null <i>Automatic</i>
+ *
+ * @name DataTable.defaults.column.width
* @dtopt Columns
*
* @example
- * // Using aoColumnDefs
+ * // Using `columnDefs`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumnDefs": [
- * { "sWidth": "20%", "aTargets": [ 0 ] }
+ * "columnDefs": [
+ * { "width": "20%", "targets": [ 0 ] }
* ]
* } );
* } );
*
* @example
- * // Using aoColumns
+ * // Using `columns`
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoColumns": [
- * { "sWidth": "20%" },
+ * "columns": [
+ * { "width": "20%" },
* null,
* null,
* null,
@@ -718,3 +754,5 @@ DataTable.defaults.columns = {
"sWidth": null
};
+_fnHungarianMap( DataTable.defaults.column );
+
785 media/src/model/model.defaults.js
View
@@ -1,4 +1,19 @@
+/*
+ * Developer note: The properties of the object below are given in Hungarian
+ * notation, that was used as the interface for DataTables prior to v1.10, however
+ * from v1.10 onwards the primary interface is camel case. In order to avoid
+ * breaking backwards compatibility utterly with this change, the Hungarian
+ * version is still, internally the primary interface, but is is not documented
+ * - hence the @name tags in each doc comment. This allows a Javascript function
+ * to create a map from Hungarian notation to camel case (going the other direction
+ * would require each property to be listed, which would at around 3K to the size
+ * of DataTables, while this method is about a 0.5K hit.
+ *
+ * Ultimately this does pave the way for Hungarian notation to be dropped
+ * completely, but that is a massive amount of work and will break current
+ * installs (therefore is on-hold until v2).
+ */
/**
* Initialisation options that can be given to DataTables at initialisation
@@ -13,31 +28,33 @@ DataTable.defaults = {
* example with a custom Ajax call.
* @type array
* @default null
+ *
* @dtopt Option
+ * @name DataTable.defaults.data
*
* @example
* // Using a 2D array data source
* $(document).ready( function () {
* $('#example').dataTable( {
- * "aaData": [
+ * "data": [
* ['Trident', 'Internet Explorer 4.0', 'Win 95+', 4, 'X'],
* ['Trident', 'Internet Explorer 5.0', 'Win 95+', 5, 'C'],
* ],
- * "aoColumns": [
- * { "sTitle": "Engine" },
- * { "sTitle": "Browser" },
- * { "sTitle": "Platform" },
- * { "sTitle": "Version" },
- * { "sTitle": "Grade" }
+ * "columns": [
+ * { "title": "Engine" },
+ * { "title": "Browser" },
+ * { "title": "Platform" },
+ * { "title": "Version" },
+ * { "title": "Grade" }
* ]
* } );
* } );
*
* @example
- * // Using an array of objects as a data source (mData)
+ * // Using an array of objects as a data source (`data`)
* $(document).ready( function () {
* $('#example').dataTable( {
- * "aaData": [
+ * "data": [
* {
* "engine": "Trident",
* "browser": "Internet Explorer 4.0",
@@ -53,12 +70,12 @@ DataTable.defaults = {
* "grade": "C"
* }
* ],
- * "aoColumns": [
- * { "sTitle": "Engine", "mData": "engine" },
- * { "sTitle": "Browser", "mData": "browser" },
- * { "sTitle": "Platform", "mData": "platform" },
- * { "sTitle": "Version", "mData": "version" },
- * { "sTitle": "Grade", "mData": "grade" }
+ * "columns": [
+ * { "title": "Engine", "data": "engine" },
+ * { "title": "Browser", "data": "browser" },
+ * { "title": "Platform", "data": "platform" },
+ * { "title": "Version", "data": "version" },
+ * { "title": "Grade", "data": "grade" }
* ]
* } );
* } );
@@ -69,25 +86,27 @@ DataTable.defaults = {
/**
* If sorting is enabled, then DataTables will perform a first pass sort on
* initialisation. You can define which column(s) the sort is performed upon,
- * and the sorting direction, with this variable. The aaSorting array should
+ * and the sorting direction, with this variable. The `sorting` array should
* contain an array for each column to be sorted initially containing the
* column's index and a direction string ('asc' or 'desc').
* @type array
* @default [[0,'asc']]
+ *
* @dtopt Option
+ * @name DataTable.defaults.sorting
*
* @example
* // Sort by 3rd column first, and then 4th column
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aaSorting": [[2,'asc'], [3,'desc']]
+ * "sorting": [[2,'asc'], [3,'desc']]
* } );
* } );
*
* // No initial sorting
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aaSorting": []
+ * "sorting": []
* } );
* } );
*/
@@ -95,7 +114,7 @@ DataTable.defaults = {
/**
- * This parameter is basically identical to the aaSorting parameter, but
+ * This parameter is basically identical to the `sorting` parameter, but
* cannot be overridden by user interaction with the table. What this means
* is that you could have a column (visible or hidden) which the sorting will
* always be forced on first - any sorting after that (from the user) will
@@ -103,12 +122,14 @@ DataTable.defaults = {
* together.
* @type array
* @default null
+ *
* @dtopt Option
+ * @name DataTable.defaults.sortingFixed
*
* @example
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aaSortingFixed": [[0,'asc']]
+ * "sortingFixed": [[0,'asc']]
* } );
* } )
*/
@@ -124,23 +145,25 @@ DataTable.defaults = {
* displayed options (useful for language strings such as 'All').
* @type array
* @default [ 10, 25, 50, 100 ]
+ *
* @dtopt Option
+ * @name DataTable.defaults.lengthMenu
*
* @example
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aLengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]]
+ * "lengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]]
* } );
* } );
*
* @example
* // Setting the default display length as well as length menu
* // This is likely to be wanted if you remove the '10' option which
- * // is the iDisplayLength default.
+ * // is the displayLength default.
* $(document).ready( function() {
* $('#example').dataTable( {
- * "iDisplayLength": 25,
- * "aLengthMenu": [[25, 50, 100, -1], [25, 50, 100, "All"]]
+ * "displayLength": 25,
+ * "lengthMenu": [[25, 50, 100, -1], [25, 50, 100, "All"]]
* } );
* } );
*/
@@ -148,25 +171,27 @@ DataTable.defaults = {
/**
- * The aoColumns option in the initialisation parameter allows you to define
+ * The `columns` option in the initialisation parameter allows you to define
* details about the way individual columns behave. For a full list of
* column options that can be set, please see
- * {@link DataTable.defaults.columns}. Note that if you use aoColumns to
+ * {@link DataTable.defaults.column}. Note that if you use `columns` to
* define your columns, you must have an entry in the array for every single
* column that you have in your table (these can be null if you don't which
* to specify any options).
* @member
+ *
+ * @name DataTable.defaults.column
*/
"aoColumns": null,
/**
- * Very similar to aoColumns, aoColumnDefs allows you to target a specific
- * column, multiple columns, or all columns, using the aTargets property of
+ * Very similar to `columns`, `columnDefs` allows you to target a specific
+ * column, multiple columns, or all columns, using the `targets` property of
* each object in the array. This allows great flexibility when creating
- * tables, as the aoColumnDefs arrays can be of any length, targeting the
- * columns you specifically want. aoColumnDefs may use any of the column
- * options available: {@link DataTable.defaults.columns}, but it _must_
- * have aTargets defined in each object in the array. Values in the aTargets
+ * tables, as the `columnDefs` arrays can be of any length, targeting the
+ * columns you specifically want. `columnDefs` may use any of the column
+ * options available: {@link DataTable.defaults.column}, but it _must_
+ * have `targets` defined in each object in the array. Values in the `targets`
* array may be:
* <ul>
* <li>a string - class name will be matched on the TH for the column</li>
@@ -175,28 +200,32 @@ DataTable.defaults = {
* <li>the string "_all" - all columns (i.e. assign a default)</li>
* </ul>
* @member
+ *
+ * @name DataTable.defaults.columnDefs
*/
"aoColumnDefs": null,
/**
- * Basically the same as oSearch, this parameter defines the individual column
+ * Basically the same as `search`, this parameter defines the individual column
* filtering state at initialisation time. The array must be of the same size
* as the number of columns, and each element be an object with the parameters
- * "sSearch" and "bEscapeRegex" (the latter is optional). 'null' is also
+ * `search` and `escapeRegex` (the latter is optional). 'null' is also
* accepted and the default will be used.
* @type array
* @default []
+ *
* @dtopt Option
+ * @name DataTable.defaults.searchCols
*
* @example
* $(document).ready( function() {
* $('#example').dataTable( {
- * "aoSearchCols": [
+ * "searchCols": [
* null,
- * { "sSearch": "My filter" },
+ * { "search": "My filter" },
* null,
- * { "sSearch": "^[0-9]", "bEscapeRegex": false }
+ * { "search": "^[0-9]", "escapeRegex": false }
* ]
* } );
* } )
@@ -209,14 +238,16 @@ DataTable.defaults = {
* array may be of any length, and DataTables will apply each class
* sequentially, looping when required.
* @type array
- * @default null <i>Will take the values determined by the oClasses.sStripe*
+ * @default null <i>Will take the values determined by the `oClasses.stripe*`
* options</i>
+ *
* @dtopt Option
+ * @name DataTable.defaults.stripeClasses
*
* @example
* $(document).ready( function() {
* $('#example').dataTable( {
- * "asStripeClasses": [ 'strip1', 'strip2', 'strip3' ]
+ * "stripeClasses": [ 'strip1', 'strip2', 'strip3' ]
* } );
* } )
*/
@@ -226,15 +257,17 @@ DataTable.defaults = {
/**
* Enable or disable automatic column width calculation. This can be disabled
* as an optimisation (it takes some time to calculate the widths) if the
- * tables widths are passed in using aoColumns.
+ * tables widths are passed in using `columns`.
* @type boolean
* @default true
+ *
* @dtopt Features
+ * @name DataTable.defaults.autoWidth
*
* @example
* $(document).ready( function () {
* $('#example').dataTable( {
- * "bAutoWidth": false
+ * "autoWidth": false
* } );
* } );
*/
@@ -249,13 +282,15 @@ DataTable.defaults = {
* time.
* @type boolean
* @default false
+ *
* @dtopt Features
+ * @name DataTable.defaults.deferRender
*
* @example
* $(document).ready( function() {
- * var oTable = $('#example').dataTable( {
- * "sAjaxSource": "sources/arrays.txt",
- * "bDeferRender": true
+ * $('#example').dataTable( {
+ * "ajaxSource": "sources/arrays.txt",
+ * "deferRender": true
* } );
* } );
*/
@@ -269,19 +304,21 @@ DataTable.defaults = {
* per normal.
* @type boolean
* @default false
+ *
* @dtopt Options
+ * @name DataTable.defaults.destroy
*
* @example
* $(document).ready( function() {
* $('#example').dataTable( {
- * "sScrollY": "200px",
- * "bPaginate": false
+ * "srollY": "200px",
+ * "paginate": false
* } );
*
* // Some time later....
* $('#example').dataTable( {
- * "bFilter": false,
- * "bDestroy": true
+ * "filter": false,
+ * "destroy": true
* } );
* } );
*/
@@ -295,15 +332,17 @@ DataTable.defaults = {
* specified (this allow matching across multiple columns). Note that if you
* wish to use filtering in DataTables this must remain 'true' - to remove the
* default filtering input box and retain filtering abilities, please use
- * {@link DataTable.defaults.sDom}.
+ * {@link DataTable.defaults.dom}.
* @type boolean
* @default true
+ *
* @dtopt Features
+ * @name DataTable.defaults.filter
*
* @example
* $(document).ready( function () {
* $('#example').dataTable( {
- * "bFilter": false
+ * "filter": false
* } );
* } );
*/
@@ -316,12 +355,14 @@ DataTable.defaults = {
* about filtered data if that action is being performed.
* @type boolean
* @default true
+ *
* @dtopt Features
+ * @name DataTable.defaults.info
*
* @example
* $(document).ready( function () {
* $('#example').dataTable( {
- * "bInfo": false
+ * "info": false
* } );
* } );
*/
@@ -334,12 +375,14 @@ DataTable.defaults = {
* traditionally used).
* @type boolean
* @default false
+ *
* @dtopt Features
+ * @name DataTable.defaults.jQueryUI
*
* @example
* $(document).ready( function() {
* $('#example').dataTable( {
- * "bJQueryUI": true
+ * "jQueryUI": true
* } );
* } );
*/
@@ -348,15 +391,17 @@ DataTable.defaults = {
/**
* Allows the end user to select the size of a formatted page from a select
- * menu (sizes are 10, 25, 50 and 100). Requires pagination (bPaginate).
+ * menu (sizes are 10, 25, 50 and 100). Requires pagination (`paginate`).
* @type boolean
* @default true
+ *
* @dtopt Features
+ * @name DataTable.defaults.lengthChange
*
* @example
* $(document).ready( function () {
* $('#example').dataTable( {
- * "bLengthChange": false
+ * "lengthChange": false
* } );
* } );
*/
@@ -367,12 +412,14 @@ DataTable.defaults = {
* Enable or disable pagination.
* @type boolean
* @default true
+ *
* @dtopt Features
+ * @name DataTable.defaults.paginate
*
* @example
* $(document).ready( function () {
* $('#example').dataTable( {
- * "bPaginate": false
+ * "paginate": false
* } );
* } );
*/
@@ -386,12 +433,14 @@ DataTable.defaults = {
* the entries.
* @type boolean
* @default false
+ *
* @dtopt Features
+ * @name DataTable.defaults.processing
*
* @example
* $(document).ready( function () {
* $('#example').dataTable( {
- * "bProcessing": true
+ * "processing": true
* } );
* } );
*/
@@ -404,11 +453,13 @@ DataTable.defaults = {
* to simply return the object that has already been set up - it will not take
* account of any changes you might have made to the initialisation object
* passed to DataTables (setting this parameter to true is an acknowledgement
- * that you understand this). bDestroy can be used to reinitialise a table if
+ * that you understand this). `destroy` can be used to reinitialise a table if
* you need.
* @type boolean
* @default false
+ *
* @dtopt Options
+ * @name DataTable.defaults.retrieve
*
* @example
* $(document).ready( function() {
@@ -419,15 +470,15 @@ DataTable.defaults = {
* function initTable ()
* {
* return $('#example').dataTable( {
- * "sScrollY": "200px",
- * "bPaginate": false,
- * "bRetrieve": true
+ * "scrollY": "200px",
+ * "paginate": false,
+ * "retrieve": true
* } );
* }
*
* function tableActions ()
* {
- * var oTable = initTable();
+ * var table = initTable();
* // perform API operations with oTable
* }
*/
@@ -440,13 +491,15 @@ DataTable.defaults = {
* this.
* @type boolean
* @default true
+ *
* @dtopt Options
+ * @name DataTable.defaults.scrollAutoCss
*
* @example
* $(document).ready( function() {
* $('#example').dataTable( {
- * "bScrollAutoCss": false,
- * "sScrollY": "200px"
+ * "scrollAutoCss": false,
+ * "scrollY": "200px"
* } );
* } );
*/
@@ -462,13 +515,15 @@ DataTable.defaults = {
* the result set will fit within the given Y height.
* @type boolean
* @default false
+ *
* @dtopt Options
+ * @name DataTable.defaults.scrollCollapse
*
* @example
* $(document).ready( function() {
* $('#example').dataTable( {
- * "sScrollY": "200",
- * "bScrollCollapse": true
+ * "scrollY": "200",
+ * "scrollCollapse": true
* } );
* } );
*/
@@ -477,21 +532,23 @@ DataTable.defaults = {
/**
* Enable infinite scrolling for DataTables (to be used in combination with
- * sScrollY). Infinite scrolling means that DataTables will continually load
+ * `scrollY`). Infinite scrolling means that DataTables will continually load
* data as a user scrolls through a table, which is very useful for large
* dataset. This cannot be used with pagination, which is automatically
- * disabled. Note - the Scroller extra for DataTables is recommended in
+ * disabled. *Note*: the Scroller extra for DataTables is recommended in
* in preference to this option.
* @type boolean
* @default false
+ *
* @dtopt Features
+ * @name DataTable.defaults.scrollInfinite
*
* @example
* $(document).ready( function() {
* $('#example').dataTable( {
- * "bScrollInfinite": true,
- * "bScrollCollapse": true,
- * "sScrollY": "200px"
+ * "scrollInfinite": true,
+ * "scrollCollapse": true,
+ * "scrollY": "200px"
* } );
* } );
*/
@@ -500,18 +557,20 @@ DataTable.defaults = {
/**
* Configure DataTables to use server-side processing. Note that the
- * sAjaxSource parameter must also be given in order to give DataTables a
+ * `ajaxSource` parameter must also be given in order to give DataTables a
* source to obtain the required data for each draw.
* @type boolean
* @default false
+ *
* @dtopt Features
* @dtopt Server-side
+ * @name DataTable.defaults.serverSide
*
* @example
* $(document).ready( function () {
* $('#example').dataTable( {
- * "bServerSide": true,
- * "sAjaxSource": "xhr.php"
+ * "serverSide": true,
+ * "ajaxSource": "xhr.php"
* } );
* } );
*/
@@ -520,15 +579,17 @@ DataTable.defaults = {
/**
* Enable or disable sorting of columns. Sorting of individual columns can be
- * disabled by the "bSortable" option for each column.
+ * disabled by the `sortable` option for each column.
* @type boolean
* @default true
+ *
* @dtopt Features
+ * @name DataTable.defaults.sort
*
* @example
* $(document).ready( function () {
* $('#example').dataTable( {
- * "bSort": false
+ * "sort": false
* } );
* } );
*/
@@ -541,12 +602,14 @@ DataTable.defaults = {
* This is useful when using complex headers.
* @type boolean
* @default false
+ *
* @dtopt Options
+ * @name DataTable.defaults.sortCellsTop
*
* @example
* $(document).ready( function() {
* $('#example').dataTable( {
- * "bSortCellsTop": true
+ * "sortCellsTop": true
* } );
* } );
*/
@@ -561,12 +624,14 @@ DataTable.defaults = {
* turn this off.
* @type boolean
* @default true
+ *
* @dtopt Features
+ * @name DataTable.defaults.sortClasses
*
* @example
* $(document).ready( function () {
* $('#example').dataTable( {
- * "bSortClasses": false
+ * "sortClasses": false
* } );
* } );
*/
@@ -580,12 +645,14 @@ DataTable.defaults = {
* display display will match what thy had previously set up.
* @type boolean
* @default false
+ *
* @dtopt Features
+ * @name DataTable.defaults.stateSave
*
* @example
* $(document).ready( function () {
* $('#example').dataTable( {
- * "bStateSave": true
+ * "stateSave": true
* } );
* } );
*/
@@ -597,22 +664,24 @@ DataTable.defaults = {
* DataTables with state saving enabled. This function is called whenever
* the cookie is modified, and it expects a fully formed cookie string to be
* returned. Note that the data object passed in is a Javascript object which
- * must be converted to a string (JSON.stringify for example).
+ * must be converted to a string (`JSON.stringify` for example).
* @type function
- * @param {string} sName Name of the cookie defined by DataTables
- * @param {object} oData Data to be stored in the cookie
- * @param {string} sExpires Cookie expires string
- * @param {string} sPath Path of the cookie to set
+ * @param {string} name Name of the cookie defined by DataTables
+ * @param {object} data Data to be stored in the cookie
+ * @param {string} expires Cookie expires string
+ * @param {string} path Path of the cookie to set
* @returns {string} Cookie formatted string (which should be encoded by
* using encodeURIComponent())
+ *
* @dtopt Callbacks
+ * @name DataTable.defaults.cookieCallback
*
* @example
* $(document).ready( function () {
* $('#example').dataTable( {
- * "fnCookieCallback": function (sName, oData, sExpires, sPath) {
- * // Customise oData or sName or whatever else here
- * return sName + "="+JSON.stringify(oData)+"; expires=" + sExpires +"; path=" + sPath;
+ * "cookieCallback": function (name, data, expires, path) {
+ * // Customise data or name or whatever else here
+ * return name + "="+JSON.stringify(data)+"; expires=" + expires +"; path=" + path;
* }
* } );
* } );
@@ -625,19 +694,21 @@ DataTable.defaults = {
* elements have been inserted), or registered if using a DOM source, allowing
* manipulation of the TR element (adding classes etc).
* @type function
- * @param {node} nRow "TR" element for the current row
- * @param {array} aData Raw data array for this row
- * @param {int} iDataIndex The index of this row in aoData
+ * @param {node} row "TR" element for the current row
+ * @param {array} data Raw data array for this row
+ * @param {int} dataIndex The index of this row in the internal aoData array
+ *
* @dtopt Callbacks
+ * @name DataTable.defaults.createdRow
*
* @example
* $(document).ready( function() {
* $('#example').dataTable( {
- * "fnCreatedRow": function( nRow, aData, iDataIndex ) {
+ * "createdRow": function( row, data, dataIndex ) {
* // Bold the grade for all 'A' grade browsers
- * if ( aData[4] == "A" )
+ * if ( data[4] == "A" )
* {
- * $('td:eq(4)', nRow).html( '<b>A</b>' );
+ * $('td:eq(4)', row).html( '<b>A</b>' );
* }
* }
* } );
@@ -650,13 +721,15 @@ DataTable.defaults = {
* This function is called on every 'draw' event, and allows you to
* dynamically modify any aspect you want about the created DOM.
* @type function
- * @param {object} oSettings DataTables settings object
+ * @param {object} settings DataTables settings object
+ *
* @dtopt Callbacks
+ * @name DataTable.defaults.drawCallback
*
* @example
* $(document).ready( function() {
* $('#example').dataTable( {
- * "fnDrawCallback": function( oSettings ) {
+ * "fnDrawCallback": function( settings ) {
* alert( 'DataTables has redrawn the table' );
* }
* } );
@@ -669,21 +742,23 @@ DataTable.defaults = {
* Identical to fnHeaderCallback() but for the table footer this function
* allows you to modify the table footer on every 'draw' even.
* @type function
- * @param {node} nFoot "TR" element for the footer
- * @param {array} aData Full table data (as derived from the original HTML)
- * @param {int} iStart Index for the current display starting point in the
+ * @param {node} foot "TR" element for the footer
+ * @param {array} data Full table data (as derived from the original HTML)
+ * @param {int} start Index for the current display starting point in the
* display array
- * @param {int} iEnd Index for the current display ending point in the
+ * @param {int} end Index for the current display ending point in the
* display array
- * @param {array int} aiDisplay Index array to translate the visual position
+ * @param {array int} display Index array to translate the visual position
* to the full data array
+ *
* @dtopt Callbacks
+ * @name DataTable.defaults.footerCallback
*
* @example
* $(document).ready( function() {
* $('#example').dataTable( {
- * "fnFooterCallback": function( nFoot, aData, iStart, iEnd, aiDisplay ) {
- * nFoot.getElementsByTagName('th')[0].innerHTML = "Starting index is "+iStart;
+ * "footerCallback": function( foot, data, start, end, display ) {
+ * foot.getElementsByTagName('th')[0].innerHTML = "Starting index is "+start;
* }
* } );
* } )
@@ -699,19 +774,21 @@ DataTable.defaults = {
* function will override the default method DataTables uses.
* @type function
* @member
- * @param {int} iIn number to be formatted
+ * @param {int} toFormat number to be formatted
* @returns {string} formatted string for DataTables to show the number
+ *
* @dtopt Callbacks
+ * @name DataTable.defaults.formatNumber
*
* @example
* $(document).ready( function() {
* $('#example').dataTable( {
- * "fnFormatNumber": function ( iIn ) {
- * if ( iIn &lt; 1000 ) {
- * return iIn;
+ * "formatNumber": function ( toFormat ) {
+ * if ( toFormat &lt; 1000 ) {
+ * return toFormat;
* } else {
* var
- * s=(iIn+""),
+ * s=(toFormat+""),
* a=s.split(""), out="",
* iLen=s.length;
*
@@ -727,20 +804,20 @@ DataTable.defaults = {
* } );
* } );
*/
- "fnFormatNumber": function ( iIn ) {
- if ( iIn < 1000 )
+ "fnFormatNumber": function ( toFormat ) {
+ if ( toFormat < 1000 )
{
// A small optimisation for what is likely to be the majority of use cases
- return iIn;
+ return toFormat;
}
- var s=(iIn+""), a=s.split(""), out="", iLen=s.length;
+ var s=(toFormat+""), a=s.split(""), out="", iLen=s.length;
for ( var i=0 ; i<iLen ; i++ )
{
if ( i%3 === 0 && i !== 0 )
{
- out = this.oLanguage.sInfoThousands+out;
+ out = this.language.infoThousands+out;
}
out = a[iLen-i-1]+out;
}
@@ -753,21 +830,23 @@ DataTable.defaults = {
* dynamically modify the header row. This can be used to calculate and
* display useful information about the table.
* @type function
- * @param {node} nHead "TR" element for the header
- * @param {array} aData Full table data (as derived from the original HTML)
- * @param {int} iStart Index for the current display starting point in the
+ * @param {node} head "TR" element for the header
+ * @param {array} data Full table data (as derived from the original HTML)
+ * @param {int} start Index for the current display starting point in the
* display array
- * @param {int} iEnd Index for the current display ending point in the
+ * @param {int} end Index for the current display ending point in the
* display array
- * @param {array int} aiDisplay Index array to translate the visual position
+ * @param {array int} display Index array to translate the visual position
* to the full data array
+ *
* @dtopt Callbacks
+ * @name DataTable.defaults.headerCallback
*
* @example
* $(document).ready( function() {
* $('#example').dataTable( {
- * "fnHeaderCallback": function( nHead, aData, iStart, iEnd, aiDisplay ) {
- * nHead.getElementsByTagName('th')[0].innerHTML = "Displaying "+(iEnd-iStart)+" records";
+ * "fheaderCallback": function( head, data, start, end, display ) {
+ * head.getElementsByTagName('th')[0].innerHTML = "Displaying "+(end-start)+" records";
* }
* } );
* } )
@@ -783,20 +862,22 @@ DataTable.defaults = {
* allows you to do exactly that.
* @type function
* @param {object} oSettings DataTables settings object
- * @param {int} iStart Starting position in data for the draw
- * @param {int} iEnd End position in data for the draw
- * @param {int} iMax Total number of rows in the table (regardless of
+ * @param {int} start Starting position in data for the draw
+ * @param {int} end End position in data for the draw
+ * @param {int} max Total number of rows in the table (regardless of
* filtering)
- * @param {int} iTotal Total number of rows in the data set, after filtering
- * @param {string} sPre The string that DataTables has formatted using it's
+ * @param {int} total Total number of rows in the data set, after filtering
+ * @param {string} pre The string that DataTables has formatted using it's
* own rules
* @returns {string} The string to be displayed in the information element.
+ *
* @dtopt Callbacks
+ * @name DataTable.defaults.infoCallback
*
* @example
* $('#example').dataTable( {
- * "fnInfoCallback": function( oSettings, iStart, iEnd, iMax, iTotal, sPre ) {
- * return iStart +" to "+ iEnd;
+ * "infoCallback": function( settings, start, end, nax, total, pre ) {
+ * return start +" to "+ end;
* }
* } );
*/
@@ -809,15 +890,17 @@ DataTable.defaults = {
* however, this does not hold true when using external language information
* since that is obtained using an async XHR call.
* @type function
- * @param {object} oSettings DataTables settings object
+ * @param {object} settings DataTables settings object
* @param {object} json The JSON object request from the server - only
* present if client-side Ajax sourced data is used
+ *
* @dtopt Callbacks
+ * @name DataTable.defaults.initComplete
*
* @example
* $(document).ready( function() {
* $('#example').dataTable( {
- * "fnInitComplete": function(oSettings, json) {
+ * "initComplete": function(settings, json) {
* alert( 'DataTables has finished its initialisation.' );
* }
* } );
@@ -831,15 +914,17 @@ DataTable.defaults = {
* draw by returning false, any other return (including undefined) results in
* the full draw occurring).
* @type function
- * @param {object} oSettings DataTables settings object
+ * @param {object} settings DataTables settings object
* @returns {boolean} False will cancel the draw, anything else (including no
* return) will allow it to complete.
+ *
* @dtopt Callbacks
+ * @name DataTable.defaults.preDrawCallback
*
* @example
* $(document).ready( function() {
* $('#example').dataTable( {
- * "fnPreDrawCallback": function( oSettings ) {
+ * "preDrawCallback": function( settings ) {
* if ( $('#test').val() == 1 ) {
* return false;
* }
@@ -855,21 +940,22 @@ DataTable.defaults = {
* generated for each table draw, but before it is rendered on screen. This
* function might be used for setting the row class name etc.
* @type function
- * @param {node} nRow "TR" element for the current row
- * @param {array} aData Raw data array for this row
- * @param {int} iDisplayIndex The display index for the current table draw
- * @param {int} iDisplayIndexFull The index of the data in the full list of
+ * @param {node} row "TR" element for the current row
+ * @param {array} data Raw data array for this row
+ * @param {int} displayIndex The display index for the current table draw
+ * @param {int} displayIndexFull The index of the data in the full list of
* rows (after filtering)
+ *
* @dtopt Callbacks
+ * @name DataTable.defaults.rowCallback
*
* @example
* $(document).ready( function() {
* $('#example').dataTable( {
- * "fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
+ * "rowCallback": function( row, data, displayIndex, displayIndexFull ) {
* // Bold the grade for all 'A' grade browsers
- * if ( aData[4] == "A" )
- * {
- * $('td:eq(4)', nRow).html( '<b>A</b>' );
+ * if ( data[4] == "A" ) {
+ * $('td:eq(4)', row).html( '<b>A</b>' );
* }
* }
* } );
@@ -880,57 +966,60 @@ DataTable.defaults = {
/**
* This parameter allows you to override the default function which obtains
- * the data from the server ($.getJSON) so something more suitable for your
- * application. For example you could use POST data, or pull information from
- * a Gears or AIR database.
+ * the data from the server so something more suitable for your application. For
+ * example you could use POST data, or pull information from a Gears or AIR
+ * database.
* @type function
* @member
- * @param {string} sSource HTTP source to obtain the data from (sAjaxSource)
- * @param {array} aoData A key/value pair object containing the data to send
+ * @param {string} source HTTP source to obtain the data from (`ajaxSource`)
+ * @param {array} data A key/value pair object containing the data to send
* to the server
- * @param {function} fnCallback to be called on completion of the data get
+ * @param {function} callback to be called on completion of the data get
* process that will draw the data on the page.
- * @param {object} oSettings DataTables settings object
+ * @param {object} settings DataTables settings object
+ *
* @dtopt Callbacks
* @dtopt Server-side
+ * @name DataTable.defaults.serverData
*
* @example
- * // POST data to server
+ * // POST data to server (note you can use `serverMethod` to set the
+ * // HTTP method is that is all you want to use `serverData` for.
* $(document).ready( function() {
* $('#example').dataTable( {
- * "bProcessing": true,
- * "bServerSide": true,
- * "sAjaxSource": "xhr.php",
- * "fnServerData": function ( sSource, aoData, fnCallback, oSettings ) {
- * oSettings.jqXHR = $.ajax( {
+ * "processing": true,
+ * "serverSide": true,
+ * "ajaxSource": "xhr.php",
+ * "serverData": function ( source, data, callback, settings ) {
+ * settings.jqXHR = $.ajax( {
* "dataType": 'json',
* "type": "POST",
- * "url": sSource,
- * "data": aoData,
- * "success": fnCallback
+ * "url": source,
+ * "data": data,
+ * "success": callback
* } );
* }
* } );
* } );
*/
- "fnServerData": function ( sUrl, aoData, fnCallback, oSettings ) {
- oSettings.jqXHR = $.ajax( {
- "url": sUrl,
- "data": aoData,
+ "fnServerData": function ( url, data, callback, settings ) {
+ settings.jqXHR = $.ajax( {
+ "url": url,
+ "data": data,
"success": function (json) {
if ( json.sError ) {
- oSettings.oApi._fnLog( oSettings, 0, json.sError );
+ settings.oApi._fnLog( settings, 0, json.sError );
}
- $(oSettings.oInstance).trigger('xhr', [oSettings, json]);
- fnCallback( json );
+ $(oSettings.oInstance).trigger('xhr', [settings, json]);
+ callback( json );
},
"dataType": "json",
"cache": false,
- "type": oSettings.sServerMethod,
+ "type": settings.sServerMethod,
"error": function (xhr, error, thrown) {
if ( error == "parsererror" ) {
- oSettings.oApi._fnLog( oSettings, 0, "DataTables warning: JSON data from "+
+ settings.oApi._fnLog( settings, 0, "DataTables warning: JSON data from "+
"server could not be parsed. This is caused by a JSON formatting error." );
}
}
@@ -945,24 +1034,26 @@ DataTable.defaults = {
* passed in parameter is the data set that has been constructed by
* DataTables, and you can add to this or modify it as you require.
* @type function
- * @param {array} aoData Data array (array of objects which are name/value
+ * @param {array} data Data array (array of objects which are name/value
* pairs) that has been constructed by DataTables and will be sent to the
* server. In the case of Ajax sourced data with server-side processing
* this will be an empty array, for server-side processing there will be a
* significant number of parameters!
- * @returns {undefined} Ensure that you modify the aoData array passed in,
+ * @returns {undefined} Ensure that you modify the data array passed in,
* as this is passed by reference.
+ *
* @dtopt Callbacks
* @dtopt Server-side
+ * @name DataTable.defaults.serverParams
*
* @example
* $(document).ready( function() {
* $('#example').dataTable( {
- * "bProcessing": true,
- * "bServerSide": true,
- * "sAjaxSource": "scripts/server_processing.php",
- * "fnServerParams": function ( aoData ) {
- * aoData.push( { "name": "more_data", "value": "my_value" } );
+ * "processing": true,
+ * "serverSide": true,
+ * "ajaxSource": "scripts/server_processing.php",
+ * "