edtable AND ajax

mckenna.tim

I'd like to have editable table cells on server created data. I combined from the examples like this...

[code]

$(document).ready(function() {
var oTable = $('#example').dataTable( {
"bProcessing": true,
"sAjaxSource": '../examples_support/json_my.txt'

} );
/* Apply the jEditable handlers to the table */
$('td', oTable.fnGetNodes()).editable( '../examples_support/editable_ajax.php', {
"callback": function( sValue, y ) {
var aPos = oTable.fnGetPosition( this );
oTable.fnUpdate( sValue, aPos[0], aPos[1] );
},
"submitdata": function ( value, settings ) {
//return { "row_id": this.parentNode.getAttribute('id') };
return { "row_id": this.parentNode.cells[0].innerHTML };
},
"height": "14px"
} );
} );

[/code]

Editable works if the data is already in the html, but not with the ajax data.

allan

Please see this FAQ (highlighted in red): http://datatables.net/faqs#ss_events :-)

Allan

mckenna.tim

Thanks,
cluelessly I tried putting the jeditable code inside a setTimout which is inside a fnDrawCallback()..

[code]

$(document).ready(function() {
var oTable = $('#example').dataTable( {
"bProcessing": true,
"sAjaxSource": '../examples_support/json_my.txt',
"fnDrawCallback": function() {
setTimeout( function () {
/* Apply the jEditable handlers to the table */
$('td', oTable.fnGetNodes()).editable( '../examples_support/editable_ajax.php', {
"callback": function( sValue, y ) {
var aPos = oTable.fnGetPosition( this );
oTable.fnUpdate( sValue, aPos[0], aPos[1] );
},
"submitdata": function ( value, settings ) {
//return { "row_id": this.parentNode.getAttribute('id') };
return { "row_id": this.parentNode.cells[0].innerHTML };
},
"height": "14px"
} );
}, 0 );
}
} );
} );

[/code]
and it responded by giving me edit boxes.
Thanks, I can continue.