jEditable with DataTable new Row

dyapasrikanth

I have a problem with jeditable this is my code
[code]
var oTable = $('#masterTable').dataTable( {
"bJQueryUI": true,
"iDisplayLength": 50,
"bLengthChange": false,
"aoColumns": [{"bSearchable": false,"bVisible":false},null]
});
$('td', oTable.fnGetNodes()).editable( '/Spandana2/master.do?type=designation&purpose=update', {
"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'),
"column": oTable.fnGetPosition( this )[2]
};
},
"width": "35em"
} );
[/code]

This is my table


Designation Name
CollectorJoint CollectorAdditional Joint CollectorD.R.O.A.O.Deputy TahasildarSenior AsstJunior AsstP.O.

This is my javascript to add new row to the Table which is in the javascript file

var master=document.getElementById("master");
$('#masterTable').dataTable().fnAddData(["00",master.value]);

after adding the new row how can i call the jeditable function for the new row or is there any chance to reinitialize the datatable along with the jeditable script

freemnw

Hi dyapasrikanth,
try this code:
[code]
var oTable = $('#masterTable').dataTable( {
"bJQueryUI": true,
"iDisplayLength": 50,
"bLengthChange": false,
"aoColumns": [{"bSearchable": false,"bVisible":false},null],
"fnDrawCallback": function() {
$('td', oTable.fnGetNodes()).editable( '/Spandana2/master.do?type=designation&purpose=update', {
"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'),
"column": oTable.fnGetPosition( this )[2]
};
},
"width": "35em"
});
}
});
[/code]