Get all datas of a DataTable instance, init with server-side
Get all datas of a DataTable instance, init with server-side
yor
Posts: 3Questions: 0Answers: 0
Hi,
I works with DataTable for some time. Since 1 week, I change all my DataTable on a server-side version. This is very powerful and your code is clean to read.
Today I have a problem. I solved it. But it's not the good way!! I will explain my problem :
This following code is my DataTable initialisation. All is fine on this code.
For information I use the selectable rows (but in a reverse way. I select all by default, and the first click on the TR unselected the Row).
[code]
var aDatatableUnselected = [];
$('#example').dataTable({
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "index.php?page=articles&view=raw.articles",
"sPaginationType": "full_numbers",
"oLanguage":
{
"sUrl": "js/datatables/langs/"+lang+".txt"
},
'aLengthMenu':[[15,30,50,100],[15,30,50,100]],
'iDisplayLength':15,
'aaSorting':[],
'aoColumns':[{'bSearchable':false,'bSortable':false},null,{'sType':'html'},null,{'bSearchable':false,'bSortable':false}],
"fnServerData": function ( sSource, aoData, fnCallback, oSettings )
{
oSettings.jqXHR = $.ajax(
{
"dataType": 'json',
"type": "POST",
"url": sSource,
"data": aoData,
"success": fnCallback,
"error": function(xhr, error, thrown)
{
// function call after a catching error for not use the _fnLog alert, but show the error in a element with the class .dataTables_error (like .dataTables_empty)
oSettings.oInstance.fnServerDataError(xhr, error, thrown)
}
});
},
"fnServerParams": function ( aoData )
{
var _values = $('form[name="filtres"]').serializeArray();
return $.merge(aoData, _values);
},
'sDom': '<"top"pl>tr<"bottom"ip>',
"fnPreDrawCallback" : function( oSettings )
{
var grid = $('.grid-articles');
grid = grid.insertBefore(oSettings.nTable);
$('#articles-ajax .grid-articles-wrap').empty();
},
"fnDrawCallback": function()
{
var grid = $('.grid-articles');
var tab = $('#example');
var empty = tab.find('.dataTables_empty').html();
var error = tab.find('.dataTables_error').html();
if(empty || error)
grid.find('.grid-articles-wrap').html(''+(empty ? empty : error)+'');
},
"fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull )
{
if ( jQuery.inArray(aData.DT_RowId, aDatatableUnselected) === -1 ) {
$(nRow).addClass('row_selected');
}
$('#articles-ajax .grid-articles-wrap').append(aData.DT_RowGrid);
$('td:eq(0)', nRow).addClass(aData.DT_ColClass_0);
return nRow;
}
});
$('#example tbody tr').live('click', function ()
{
var id = this.id;
var index = jQuery.inArray(id, aDatatableUnselected);
if ( index === -1 ) {
aDatatableUnselected.push( id );
} else {
aDatatableUnselected.splice( index, 1 );
}
$(this).toggleClass('row_selected');
} );
[/code]
I created a module to export my datas in an excel file. This module use the selectable rows of Datatable. The following code is to active the export module...
[code]
$(document).on('click','#export-module_active',function()
{
var nWrapper = $('#articles');
var oDataTable = $('#exemple').dataTable();
var oSettings = oDataTable.fnSettings();
var iRecordsDisplay = oSettings.fnRecordsDisplay();
var oData = $('form[name="filtres"]').serializeArray();
oData = $.merge(oDataTable.oApi._fnAjaxParameters( oSettings ), oData);
oData.push({ name: "iDisplayStart", value: "0" });
oData.push({ name: "iDisplayLength", value: iRecordsDisplay });
var aArticles = [];
$.ajax(
{
"dataType": 'json',
"type": "POST",
"url": oSettings.sAjaxSource,
"data": oData,
"success": function(json)
{
for(var i = 0; i < iRecordsDisplay; i++)
{
// Check if my value is unselected or not
if ( jQuery.inArray(json.aaData[i].DT_RowId, aDatatableUnselected) === -1 )
{
aArticles.push({name: "art[]", value: json.aaData[i].DT_Id});
}
}
$.ajax({
"type":'post',
"url":'index.php?page=articles&view=ajax.export",
"data": aArticles,
"success":function(data)
{
nWrapper.prepend('X Close'+data+'');
//...
}
});
},
"error": function(xhr, error, thrown)
{
// My logger ...
}
});
return false;
});
[/code]
I rewrite in this code fnServerData because I do not have access of this function. I try multiple way to get ALL my rows in the Datatable (in server-side) with :
[code]
var nWrapper = $('#articles');
var oDataTable = $('#exemple').dataTable();
var oSettings = oDataTable.fnSettings();
var iRecordsDisplay = oSettings.fnRecordsDisplay();
var oData = $('form[name="filtres"]').serializeArray();
oData = $.merge(oDataTable.oApi._fnAjaxParameters( oSettings ), oData);
oData.push({ name: "iDisplayStart", value: "0" });
oData.push({ name: "iDisplayLength", value: iRecordsDisplay });
oSettings.fnServerData.call( oSettings.oInstance, oSettings.sAjaxSource, aoData, null, oSettings);
[/code]
or (but this way return only the rows show)
[code]
oDataTable.fnGetNodes();
[/code]
...
My question is :
How can I get ALL rows in Datatable in use these functions ? How can I get my fnServerParams (I try the following code but KO) ?
[code]
oDataTable.oApi._fnServerParams(oSettings, oDataTable.oApi._fnAjaxParameters( oSettings ));
[/code]
PS : I can't put on JS Fiddle or DataTables live, because your domain and my domain block the server-side.
I works with DataTable for some time. Since 1 week, I change all my DataTable on a server-side version. This is very powerful and your code is clean to read.
Today I have a problem. I solved it. But it's not the good way!! I will explain my problem :
This following code is my DataTable initialisation. All is fine on this code.
For information I use the selectable rows (but in a reverse way. I select all by default, and the first click on the TR unselected the Row).
[code]
var aDatatableUnselected = [];
$('#example').dataTable({
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "index.php?page=articles&view=raw.articles",
"sPaginationType": "full_numbers",
"oLanguage":
{
"sUrl": "js/datatables/langs/"+lang+".txt"
},
'aLengthMenu':[[15,30,50,100],[15,30,50,100]],
'iDisplayLength':15,
'aaSorting':[],
'aoColumns':[{'bSearchable':false,'bSortable':false},null,{'sType':'html'},null,{'bSearchable':false,'bSortable':false}],
"fnServerData": function ( sSource, aoData, fnCallback, oSettings )
{
oSettings.jqXHR = $.ajax(
{
"dataType": 'json',
"type": "POST",
"url": sSource,
"data": aoData,
"success": fnCallback,
"error": function(xhr, error, thrown)
{
// function call after a catching error for not use the _fnLog alert, but show the error in a element with the class .dataTables_error (like .dataTables_empty)
oSettings.oInstance.fnServerDataError(xhr, error, thrown)
}
});
},
"fnServerParams": function ( aoData )
{
var _values = $('form[name="filtres"]').serializeArray();
return $.merge(aoData, _values);
},
'sDom': '<"top"pl>tr<"bottom"ip>',
"fnPreDrawCallback" : function( oSettings )
{
var grid = $('.grid-articles');
grid = grid.insertBefore(oSettings.nTable);
$('#articles-ajax .grid-articles-wrap').empty();
},
"fnDrawCallback": function()
{
var grid = $('.grid-articles');
var tab = $('#example');
var empty = tab.find('.dataTables_empty').html();
var error = tab.find('.dataTables_error').html();
if(empty || error)
grid.find('.grid-articles-wrap').html(''+(empty ? empty : error)+'');
},
"fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull )
{
if ( jQuery.inArray(aData.DT_RowId, aDatatableUnselected) === -1 ) {
$(nRow).addClass('row_selected');
}
$('#articles-ajax .grid-articles-wrap').append(aData.DT_RowGrid);
$('td:eq(0)', nRow).addClass(aData.DT_ColClass_0);
return nRow;
}
});
$('#example tbody tr').live('click', function ()
{
var id = this.id;
var index = jQuery.inArray(id, aDatatableUnselected);
if ( index === -1 ) {
aDatatableUnselected.push( id );
} else {
aDatatableUnselected.splice( index, 1 );
}
$(this).toggleClass('row_selected');
} );
[/code]
I created a module to export my datas in an excel file. This module use the selectable rows of Datatable. The following code is to active the export module...
[code]
$(document).on('click','#export-module_active',function()
{
var nWrapper = $('#articles');
var oDataTable = $('#exemple').dataTable();
var oSettings = oDataTable.fnSettings();
var iRecordsDisplay = oSettings.fnRecordsDisplay();
var oData = $('form[name="filtres"]').serializeArray();
oData = $.merge(oDataTable.oApi._fnAjaxParameters( oSettings ), oData);
oData.push({ name: "iDisplayStart", value: "0" });
oData.push({ name: "iDisplayLength", value: iRecordsDisplay });
var aArticles = [];
$.ajax(
{
"dataType": 'json',
"type": "POST",
"url": oSettings.sAjaxSource,
"data": oData,
"success": function(json)
{
for(var i = 0; i < iRecordsDisplay; i++)
{
// Check if my value is unselected or not
if ( jQuery.inArray(json.aaData[i].DT_RowId, aDatatableUnselected) === -1 )
{
aArticles.push({name: "art[]", value: json.aaData[i].DT_Id});
}
}
$.ajax({
"type":'post',
"url":'index.php?page=articles&view=ajax.export",
"data": aArticles,
"success":function(data)
{
nWrapper.prepend('X Close'+data+'');
//...
}
});
},
"error": function(xhr, error, thrown)
{
// My logger ...
}
});
return false;
});
[/code]
I rewrite in this code fnServerData because I do not have access of this function. I try multiple way to get ALL my rows in the Datatable (in server-side) with :
[code]
var nWrapper = $('#articles');
var oDataTable = $('#exemple').dataTable();
var oSettings = oDataTable.fnSettings();
var iRecordsDisplay = oSettings.fnRecordsDisplay();
var oData = $('form[name="filtres"]').serializeArray();
oData = $.merge(oDataTable.oApi._fnAjaxParameters( oSettings ), oData);
oData.push({ name: "iDisplayStart", value: "0" });
oData.push({ name: "iDisplayLength", value: iRecordsDisplay });
oSettings.fnServerData.call( oSettings.oInstance, oSettings.sAjaxSource, aoData, null, oSettings);
[/code]
or (but this way return only the rows show)
[code]
oDataTable.fnGetNodes();
[/code]
...
My question is :
How can I get ALL rows in Datatable in use these functions ? How can I get my fnServerParams (I try the following code but KO) ?
[code]
oDataTable.oApi._fnServerParams(oSettings, oDataTable.oApi._fnAjaxParameters( oSettings ));
[/code]
PS : I can't put on JS Fiddle or DataTables live, because your domain and my domain block the server-side.
This discussion has been closed.