Ajax data source with editable row details
Ajax data source with editable row details
I'm using DataTables 1.7.6. My data is populated via Ajax, using sAjaxSource, and my processing is done client-side. I have hidden row details which contain an editable field (JEditable). The details are also loaded via an Ajax call. In order to preserve the open/closed state of the hidden rows when the table is reloaded, I have an object literal that contains the id of open rows (the id is extracted from a hidden column).
[code]
var open_row_id_set = {};
[/code]
So when the table is refreshed, I use fnRowCallback() to see if the row is in the open_row_id_set, and then open the row if necessary. The problem is, I need to call fnDraw() to keep the editable field editable...but this puts me into an infinite loop when fnDraw() in turn invokes fnRowCallback() again.
[code]
"fnRowCallback": function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {
var object_id = oTable.fnGetData(nRow)[7]; // get the id out of the hidden column
if (open_row_id_set[object_id]) {
$.get('/objects/' + object_id, function(data) { // load row details via Ajax
oTable.fnOpen( nRow, data, 'details' );
make_editable();
oTable.fnDraw(); // need to call this so the editable fields will work
});
}
return nRow;
}
[/code]
How can I continue to load my data and row details via Ajax calls, maintain the state of the opened rows between table refreshes, and have editable fields in the details rows?
thanks,
Darlene
[code]
var open_row_id_set = {};
[/code]
So when the table is refreshed, I use fnRowCallback() to see if the row is in the open_row_id_set, and then open the row if necessary. The problem is, I need to call fnDraw() to keep the editable field editable...but this puts me into an infinite loop when fnDraw() in turn invokes fnRowCallback() again.
[code]
"fnRowCallback": function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {
var object_id = oTable.fnGetData(nRow)[7]; // get the id out of the hidden column
if (open_row_id_set[object_id]) {
$.get('/objects/' + object_id, function(data) { // load row details via Ajax
oTable.fnOpen( nRow, data, 'details' );
make_editable();
oTable.fnDraw(); // need to call this so the editable fields will work
});
}
return nRow;
}
[/code]
How can I continue to load my data and row details via Ajax calls, maintain the state of the opened rows between table refreshes, and have editable fields in the details rows?
thanks,
Darlene
This discussion has been closed.
Replies
thanks,
Darlene