Skip to content

Commit

Permalink
New: fnServerParams callback function - this allows additional parame…
Browse files Browse the repository at this point in the history
…ters to be added to the XHR for server-side processing or Ajax sourced, client-side processed data, with ease. Previously it was required to override the fnServerData method just to add a couple of parameters, but the built in fnServerData method is quite comperhensive and you don't want to have to reproduce all of that unless you need to. Now you don't need to :-). fnServerParams is called on each request, so it is ideal for adding extra parameters such as search parameters which can be updated by users.
  • Loading branch information
AllanJard committed Sep 2, 2011
1 parent 4708870 commit 0c296ca
Show file tree
Hide file tree
Showing 2 changed files with 48 additions and 19 deletions.
24 changes: 7 additions & 17 deletions examples/server_side/custom_vars.html
Original file line number Diff line number Diff line change
Expand Up @@ -17,13 +17,8 @@
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "scripts/server_processing.php",
"fnServerData": function ( sSource, aoData, fnCallback ) {
/* Add some extra data to the sender */
aoData.push( { "name": "more_data", "value": "my_value" } );
$.getJSON( sSource, aoData, function (json) {
/* Do whatever additional processing you want on the callback, then tell DataTables */
fnCallback(json);
} );
"fnServerParams": function ( aoData ) {
aoData.push( { "name": "more_data", "value": "my_value" } );
}
} );
} );
Expand All @@ -36,7 +31,7 @@
</div>

<h1>Preamble</h1>
<p>It can often be useful to send a little bit of extra information to the server when utilising DataTables' server-side processing option. This can be done by overriding the function used internally to get the JSON data from the server through the use of the "fnServerData" callback. This function takes three parameters (the same as <a href="http://docs.jquery.com/Ajax/jQuery.getJSON">$.getJSON()</a>, to be manipulated as you wish. This allows you to add extra data to the second parameter and then make the AJAX call, or you can call a Google Gears DB, or whatever you want. This example shows adding a single extra HTTP variable.</p>
<p>It can often be useful to send a little bit of extra information to the server when utilising DataTables' server-side processing option. This can be done by using the <a href="http://datatables.net/ref#fnServerParams">fnServerParams</a> callback function which is called whenever an XHR is sent to the server. fnServerParams Takes a single parameter, the array of name/value pairs of parameters that are to be sent to the server. You can manipulate this as you require - typically adding another parameter, as shown in this example.</p>

<h1>Live example</h1>
<div id="dynamic">
Expand Down Expand Up @@ -74,15 +69,10 @@ <h1>Initialisation code</h1>
$('#example').dataTable( {
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "scripts/server_processing.php",
"fnServerData": function ( sSource, aoData, fnCallback ) {
/* Add some extra data to the sender */
aoData.push( { "name": "more_data", "value": "my_value" } );
$.getJSON( sSource, aoData, function (json) {
/* Do whatever additional processing you want on the callback, then tell DataTables */
fnCallback(json)
} );
}
"sAjaxSource": "scripts/server_processing.php"
"fnServerParams": function ( aoData ) {
aoData.push( { "name": "more_data", "value": "my_value" } );
}
} );
} );</pre>

Expand Down
43 changes: 41 additions & 2 deletions media/js/jquery.dataTables.js
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@
* When considering jsLint, we need to allow eval() as it it is used for reading cookies
*/
/*jslint evil: true, undef: true, browser: true */
/*globals $, jQuery,_fnExternApiFunc,_fnInitialise,_fnInitComplete,_fnLanguageProcess,_fnAddColumn,_fnColumnOptions,_fnAddData,_fnCreateTr,_fnGatherData,_fnBuildHead,_fnDrawHead,_fnDraw,_fnReDraw,_fnAjaxUpdate,_fnAjaxParameters,_fnAjaxUpdateDraw,_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,_fnArrayCmp,_fnDetectType,_fnSettingsFromNode,_fnGetDataMaster,_fnGetTrNodes,_fnGetTdNodes,_fnEscapeRegex,_fnDeleteIndex,_fnReOrderIndex,_fnColumnOrdering,_fnLog,_fnClearTable,_fnSaveState,_fnLoadState,_fnCreateCookie,_fnReadCookie,_fnDetectHeader,_fnGetUniqueThs,_fnScrollBarWidth,_fnApplyToChildren,_fnMap,_fnGetRowData,_fnGetCellData,_fnSetCellData,_fnGetObjectDataFn,_fnSetObjectDataFn*/
/*globals $, jQuery,_fnExternApiFunc,_fnInitialise,_fnInitComplete,_fnLanguageProcess,_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,_fnArrayCmp,_fnDetectType,_fnSettingsFromNode,_fnGetDataMaster,_fnGetTrNodes,_fnGetTdNodes,_fnEscapeRegex,_fnDeleteIndex,_fnReOrderIndex,_fnColumnOrdering,_fnLog,_fnClearTable,_fnSaveState,_fnLoadState,_fnCreateCookie,_fnReadCookie,_fnDetectHeader,_fnGetUniqueThs,_fnScrollBarWidth,_fnApplyToChildren,_fnMap,_fnGetRowData,_fnGetCellData,_fnSetCellData,_fnGetObjectDataFn,_fnSetObjectDataFn*/

(function($, window, document) {
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
Expand Down Expand Up @@ -1349,6 +1349,17 @@
} );
};

/*
* Variable: aoServerParams
* Purpose: Functions which are called prior to sending an Ajax request so extra parameters
* can easily be sent to the server
* Scope: jQuery.dataTable.classSettings
* Notes: Each array element is an object with the following parameters:
* function:fn - function to call
* string:sName - name callback - useful for knowing where it came from (plugin etc)
*/
this.aoServerParams = [];

/*
* Variable: fnFormatNumber
* Purpose: Format numbers for display
Expand Down Expand Up @@ -2397,7 +2408,9 @@
/* if there is an ajax source load the data */
if ( oSettings.sAjaxSource !== null && !oSettings.oFeatures.bServerSide )
{
oSettings.fnServerData.call( oSettings.oInstance, oSettings.sAjaxSource, [], function(json) {
var aoData = [];
_fnServerParams( oSettings, aoData );
oSettings.fnServerData.call( oSettings.oInstance, oSettings.sAjaxSource, aoData, function(json) {
var aData = json;
if ( oSettings.sAjaxDataProp !== "" )
{
Expand Down Expand Up @@ -3429,6 +3442,7 @@
_fnProcessingDisplay( oSettings, true );
var iColumns = oSettings.aoColumns.length;
var aoData = _fnAjaxParameters( oSettings );
_fnServerParams( oSettings, aoData );

oSettings.fnServerData.call( oSettings.oInstance, oSettings.sAjaxSource, aoData,
function(json) {
Expand Down Expand Up @@ -3507,6 +3521,21 @@
return aoData;
}

/*
* Function: _fnServerParams
* Purpose: Add Ajax parameters from plugins
* Returns: -
* Inputs: object:oSettings - dataTables settings object
* array objects:aoData - name/value pairs to send to the server
*/
function _fnServerParams( oSettings, aoData )
{
for ( var i=0, iLen=oSettings.aoServerParams.length ; i<iLen ; i++ )
{
oSettings.aoServerParams[i].fn.call( oSettings.oInstance, aoData );
}
}

/*
* Function: _fnAjaxUpdateDraw
* Purpose: Data the data from the server (nuking the old) and redraw the table
Expand Down Expand Up @@ -6809,6 +6838,7 @@
this.oApi._fnAjaxUpdate = _fnAjaxUpdate;
this.oApi._fnAjaxParameters = _fnAjaxParameters;
this.oApi._fnAjaxUpdateDraw = _fnAjaxUpdateDraw;
this.oApi._fnServerParams = _fnServerParams;
this.oApi._fnAddOptionsHtml = _fnAddOptionsHtml;
this.oApi._fnFeatureHtmlTable = _fnFeatureHtmlTable;
this.oApi._fnScrollDraw = _fnScrollDraw;
Expand Down Expand Up @@ -7019,6 +7049,15 @@
} );
}

/* Ajax additional variables are array driven */
if ( typeof oInit.fnServerParams == 'function' )
{
oSettings.aoServerParams.push( {
"fn": oInit.fnServerParams,
"sName": "user"
} );
}

if ( typeof oInit.fnStateSaveCallback == 'function' )
{
oSettings.aoStateSave.push( {
Expand Down

0 comments on commit 0c296ca

Please sign in to comment.