jeditable and pagination

johnj

Hi,

I looked into old discussions but I did not see anything that I need.

I am using DataTables with jeditable and pagination. Every thing works great except when I move to another page.
For example if I have a cell with data "orange". I edited this to "apple". It updates the database and echoes back as "apple". But if I navigate to another page,say page 2 and comeback then it shows the old values (orange). If I use the browser refresh button it updates this to "apple". How can I update the table without a refresh?

My code looks like this:
[code]
$(document).ready(function() {
var oTable = $('#example').dataTable( {
"sPaginationType": "full_numbers",
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "getData.php",
"fnServerData": fnDataTablesPipeline,
"fnDrawCallback": function () {
$('#example tbody td').editable('updateData.php', {
event:"dblclick",
indicator : '',
style: "inherit",
submit : 'Save',
cancel : 'Cancel',
placeholder: '',
cssclass : "editable",

"callback": function( sValue, y ) {
var aPos = oTable.fnGetPosition(this);
oTable.fnUpdate(sValue, aPos[0], aPos[1],false);
},
"submitdata": function (value,settings ) {
var aPos = oTable.fnGetPosition(this);
var aData = oTable.fnSettings().aoData[aPos[0]]._aData;
return {"recId":aData[0],"editedCellNum":aPos[1]};
},
"height": "14px"
});
}
});

} );
[/code]
Can somebody please tell me what is going wrong here? I don't know how to clear the table cache(if present).

allan

Hi johnj,

The problem in this case is that you are using pipelining :-) The function fnDataTablesPipeline is caching the previous value ("orange") and therefore restoring it when the page is requested again from the cache, rather than from the database. You should be able to see this in action as there will be no XHR when you page back.

So to get around this I think there are two immediate options:

1. Don't use pipelining
2. Empty the pipe's cache.

The first is easy, the second a little more involved. For the second you'll need to delete that cache when you submit the jEditable data. The way to do this is probably to set:

[code]
oCache = {
iCacheLower: -1
};
[/code]
i.e. it's initial state - so it will go and get the info from the server again.

Regards,
Allan

johnj

Hi Allan,

Thanks for your comments. I used the second option that you have mentioned above and it did the trick. The table is able to pull new/current values. Many thanks to you.

thanks again

John