DataTables not getting refreshed with change of JSON data thru jQuery ajax()
DataTables not getting refreshed with change of JSON data thru jQuery ajax()
Ajith86
Posts: 7Questions: 0Answers: 0
I have started using DataTables recently,got stuck with the below mentioned issue
I am populating DataTables using the JSON data thru jQuery ajax(). The data is loaded based on the few dropdown filters. But while changing the filter values the DataTables is not getting refreshed with new values.
This is the code I am using ,
HTML:-
[code]
[/code]
Script:-
[code]
$.ajax({
type : "POST",
url : url,
data:MODEL,
success : function(data)
{
ddTable=$('#ex_table').dataTable({
"aaData" : data.response,
"aoColumns" : [
{ "sTitle": "Col1", "bSortable": true},
{ "sTitle": "Col2", "bSortable": true },
{ "sTitle": "Col3", "bSortable": true },
{ "sTitle": "Col4", "bSortable": true},
{ "sTitle": "Col5", "bSortable": true },
{ "sTitle": "Col6","bSortable": true }],
"bFilter" : false,
"bLengthChange" : false,
"bPaginate" : true,
"bInfo" : true,
"iDisplayLength" : 5,
"bRetrieve":true,
"bDestroy ":true,
"fnInitComplete": function()
{
this.fnAdjustColumnSizing(true);
}
});
}
});
[/code]
I am populating DataTables using the JSON data thru jQuery ajax(). The data is loaded based on the few dropdown filters. But while changing the filter values the DataTables is not getting refreshed with new values.
This is the code I am using ,
HTML:-
[code]
[/code]
Script:-
[code]
$.ajax({
type : "POST",
url : url,
data:MODEL,
success : function(data)
{
ddTable=$('#ex_table').dataTable({
"aaData" : data.response,
"aoColumns" : [
{ "sTitle": "Col1", "bSortable": true},
{ "sTitle": "Col2", "bSortable": true },
{ "sTitle": "Col3", "bSortable": true },
{ "sTitle": "Col4", "bSortable": true},
{ "sTitle": "Col5", "bSortable": true },
{ "sTitle": "Col6","bSortable": true }],
"bFilter" : false,
"bLengthChange" : false,
"bPaginate" : true,
"bInfo" : true,
"iDisplayLength" : 5,
"bRetrieve":true,
"bDestroy ":true,
"fnInitComplete": function()
{
this.fnAdjustColumnSizing(true);
}
});
}
});
[/code]
This discussion has been closed.
Replies
Allan
[code]
$.ajax({
type : "POST",
url : url,
data:MODEL,
success : function(data)
{
if (typeof ddTable == 'undefined')
{
ddTable=$('#ex_table').dataTable({
"aaData" : data.response,
"aoColumns" : [
{ "sTitle": "Col1", "bSortable": true},
{ "sTitle": "Col2", "bSortable": true },
{ "sTitle": "Col3", "bSortable": true },
{ "sTitle": "Col4", "bSortable": true},
{ "sTitle": "Col5", "bSortable": true },
{ "sTitle": "Col6","bSortable": true }],
"bFilter" : false,
"bLengthChange" : false,
"bPaginate" : true,
"bInfo" : true,
"iDisplayLength" : 5,
});
}
else
{
ddTable.fnClearTable( 0 );
ddTable.fnAddData(data.response);
}
}
});
[/code]
Thanks Allan for your help and time on this. It is appreciated.