Getting TD/TR class, and attribute information via ajax along with data, but sorting doesn't work.
Getting TD/TR class, and attribute information via ajax along with data, but sorting doesn't work.
Hi - I need to be able to retrieve and set row and cell class names and other attributes as well as the table cell data via ajax.
I figured a way to do this using fnRowCallBack where the server returns an object for each cell rather than just a value and fnRowCallBack sets the appropriate values in the table accordingly -- code below. However, table sorting doesn't work, probably due to the aData value being an object instead of a string.
Is there some way to make this all work?
[code]
var oTable = $('#table').dataTable(
{
"bPaginate": true,
"bSort": true,
"aaSorting": [[ 1, "asc" ],[ 0, "asc" ]],
"iDisplayLength" : 25,
"aLengthMenu": [[5, 10, 15, 25, 50, 100 , -1], [5, 10, 15, 25, 50, 100, "All"]],
"sAjaxSource": "data?",
"bProcessing": true,
"fnRowCallback": function( nRow, aData, iDisplayIndex )
{
// add the sensor_index and scene_id attributes to each row
$('td',nRow).each(function(i,v)
{
if (typeof aData[i]=='object'){
if (typeof aData[i].style!='undefined'){
$(v).attr('style',aData[i].style);
}
if (typeof aData[i].class!='undefined'){
$(v).addClass(aData[i].class);
}
if (typeof aData[i].row_class!='undefined'){
$(v).parent().addClass(aData[i].row_class);
}
if (typeof aData[i].row_id!='undefined'){
$(v).parent().attr('row_id',aData[i].row_id);
}
if (typeof aData[i].cssclass!='undefined'){
$(v).removeClass(aData[i].cssclass);
$(v).addClass(aData[i].cssclass);
}
$(v).html('');
if (typeof aData[i].data!='undefined'){
$(v).html(aData[i].data);
}
}
});
},
});
[/code]
I figured a way to do this using fnRowCallBack where the server returns an object for each cell rather than just a value and fnRowCallBack sets the appropriate values in the table accordingly -- code below. However, table sorting doesn't work, probably due to the aData value being an object instead of a string.
Is there some way to make this all work?
[code]
var oTable = $('#table').dataTable(
{
"bPaginate": true,
"bSort": true,
"aaSorting": [[ 1, "asc" ],[ 0, "asc" ]],
"iDisplayLength" : 25,
"aLengthMenu": [[5, 10, 15, 25, 50, 100 , -1], [5, 10, 15, 25, 50, 100, "All"]],
"sAjaxSource": "data?",
"bProcessing": true,
"fnRowCallback": function( nRow, aData, iDisplayIndex )
{
// add the sensor_index and scene_id attributes to each row
$('td',nRow).each(function(i,v)
{
if (typeof aData[i]=='object'){
if (typeof aData[i].style!='undefined'){
$(v).attr('style',aData[i].style);
}
if (typeof aData[i].class!='undefined'){
$(v).addClass(aData[i].class);
}
if (typeof aData[i].row_class!='undefined'){
$(v).parent().addClass(aData[i].row_class);
}
if (typeof aData[i].row_id!='undefined'){
$(v).parent().attr('row_id',aData[i].row_id);
}
if (typeof aData[i].cssclass!='undefined'){
$(v).removeClass(aData[i].cssclass);
$(v).addClass(aData[i].cssclass);
}
$(v).html('');
if (typeof aData[i].data!='undefined'){
$(v).html(aData[i].data);
}
}
});
},
});
[/code]
This discussion has been closed.
Replies