Error with MakeEditable and Pagniation

rpanesar

I have run across what appears to be a problem using Datatables and makeEditditable. When I enable pagination is enabled, the number of rows that can be edited via makeEditable seems to be limited to the number of rows specified per page. If 10 is the limit in iDisplayLength, then all 10 can edited, but once you try to edit row 11 or greater editing is not possible. If the rows per page is changed to 500, then all 500 rows can be edited, but nothing greater than 500. Turning pagination off allows all rows in the table to be editable. Below is the sample code:

var oTable = $('#generateDataTable').dataTable({

"bDestroy": true,
"bDeferRender": true,
"bSortClasses": false,
"bSort": true,
"bJQueryUI": true,
"bProcessing": true,
"aAjaxSource": JSON.stringify(data),
"bAutoWidth": false,
"sDom": 'T<"clear spacer"><"H"lfr>t<"F"ip>',
"oTableTools": {
"sRowSelect": "single",
"sSelectedClass": "row_selected",
"fnRowSelected": function (node) {
var checkbox = $(node).find("input[type=checkbox]");
$(checkbox).prop("checked", true);
// jQuery(node).find("input[type=checkbox]").attr("checked", true);
},
"fnRowDeselected": function (node) {
var checkbox = $(node).find("input[type=checkbox]");
$(checkbox).prop("checked", false);
//jQuery(node).find("input[type=checkbox]").attr("checked", false);
},
"sSwfPath": "/swf/copy_csv_xls_pdf.swf",
"aButtons": [
{
"sExtends": "xls",
"sButtonText": "Save to Excel file"
}
]
},
"iDisplayLength": 10,
"sPaginationType": "full_numbers",
"aLengthMenu": [[10, 25, 50, 100, 150, 200], [10, 25, 50, 100, 150, 200]],
"aaSorting": [[0, 'asc']],
"aaData": data,
"aoColumns": [
{ "mData": "col1", "sWidth": "5%" },
{ "mData": "col2", "sWidth": "5%" },
{ "mData": "col3", "sWidth": "2.5%" },
{ "mData": "col4", "sWidth": "7.5%" },
{ "mData": "col5", "sWidth": "32.5%" },
{ "mData": "col6", "sWidth": "32.5%" },
{ "mData": "col7", "sWidth": "5%" },
{ "mData": "col8", "sWidth": "7.5%" },
{ "mData": "Checked", "sClass": "center", "sWidth": "2.5%", "mRender": function (data, type, full) { return ''; } }
]
});

/* Apply the jEditable handlers to the table */
oTable.makeEditable({

sUpdateURL: submitEdit,
//sDeleteURL: "DeleteData.php",
"aoColumns": [
{
indicator: 'Saving ...',
tooltip: 'Click to edit ',
type: 'textarea',
submit: 'Save changes',
cancel: 'Cancel'
},
{
indicator: 'Saving Number...',
tooltip: 'Click to edit ',
type: 'textarea',
submit: 'Save changes',
cancel: 'Cancel'
},
{
indicator: 'Saving ...',
tooltip: 'Click to edit ',
type: 'textarea',
submit: 'Save changes',
cancel: 'Cancel'
},
{
indicator: 'Saving ...',
tooltip: 'Click to edit ',
type: 'textarea',
submit: 'Save changes',
cancel: 'Cancel'
},
{
indicator: 'Saving Name...',
tooltip: 'Click to edit ',
type: 'textarea',
submit: 'Save changes',
cancel: 'Cancel'
},
{
indicator: 'Saving Name ...',
tooltip: 'Click to edit ',
type: 'textarea',
submit: 'Save changes',
cancel: 'Cancel'
},
{
indicator: 'Saving ...',
tooltip: 'Click to edit ',
type: 'textarea',
submit: 'Save changes',
cancel: 'Cancel'
},
{
}
]
});
}

allan

The makeEditable plug-in was deprecated by its author and isn't supported in these forums (its third party). You might be better asking in that projects own issue tracker, although as I say, it is deprecated.

Allan