[solved] fnDeleteRow, ajax and pagination decrement problem
[solved] fnDeleteRow, ajax and pagination decrement problem
barat
Posts: 4Questions: 0Answers: 0
Hi,
I have a small problem with fnDeleteRow.
When I call this function on paginated elements (eg. 3rd, 4th paginated result), after redrawing I'm on previous page.
A movie:
http://www.screenr.com/Qx9
I'm populating my table from ajax source (json generated by php).
[code]
var oT = $('.datatable-objects').dataTable({
'bLengthChange': true,
'bPaginate': true,
'sPaginationType': 'full_numbers',
'iDisplayLength': 10,
'bInfo': false,
"aaSorting": [[ 0, "desc" ]],
"bProcessing": true,
"bServerSide": true,
"fnInitComplete": function(){this.fnSetFilteringDelay(500);},
"sAjaxSource": "/admin/ajax/lists/objects/",
"fnServerData": function ( sSource, aoData, fnCallback ) {
aoData.push( { "name": "type", "value": this.attr('rel') } );
$.ajax( {
"dataType": 'json',
"type": "POST",
"url": sSource,
"data": aoData,
"success": fnCallback
} );
},
'oLanguage':
{
"sUrl": "/media/admin/js/lang/datatables/pl_PL.txt"
}, 'aoColumns': [
null,
null,
null,
null,
null,
null,
{"bSortable": false},
{"bSearchable": false, "bSortable": false}
]
});
[/code]
My form action (each row have its mini form):
[code]
$('table').delegate('.btn16', 'click', function () {
$('.btn16').removeClass('btn_clicked');
$(this).addClass('btn_clicked');
});
$('table').delegate('.ajax-table-form', 'submit', function () {
var form = $(this);
var row = form.closest('tr');
var action = form.children('.btn_clicked').attr('value');
var tr = row.children('td');
var rowNumber = row.index();
var data = form.serialize() + '&submit=' + action;
// submit form to ajax controller
$.post(
'/admin/ajax/object/action',
data,
function(data){
if(data.status.error)
{
for(var i in data.status.error)
{
$.jGrowl(data.status.error[i]);
}
return false;
}
switch(action)
{
case "W??cz":
case "Wy??cz":
// todo effects
break;
case "Usu?":
// todo effects
break;
default:
console.log('invalid action');
}
oT.fnDeleteRow( rowNumber );
},
"json"
);
return false;
});
[/code]
PHP is correct. Only datatable is passing bad offset to PHP when refreshing I think.
I have a small problem with fnDeleteRow.
When I call this function on paginated elements (eg. 3rd, 4th paginated result), after redrawing I'm on previous page.
A movie:
http://www.screenr.com/Qx9
I'm populating my table from ajax source (json generated by php).
[code]
var oT = $('.datatable-objects').dataTable({
'bLengthChange': true,
'bPaginate': true,
'sPaginationType': 'full_numbers',
'iDisplayLength': 10,
'bInfo': false,
"aaSorting": [[ 0, "desc" ]],
"bProcessing": true,
"bServerSide": true,
"fnInitComplete": function(){this.fnSetFilteringDelay(500);},
"sAjaxSource": "/admin/ajax/lists/objects/",
"fnServerData": function ( sSource, aoData, fnCallback ) {
aoData.push( { "name": "type", "value": this.attr('rel') } );
$.ajax( {
"dataType": 'json',
"type": "POST",
"url": sSource,
"data": aoData,
"success": fnCallback
} );
},
'oLanguage':
{
"sUrl": "/media/admin/js/lang/datatables/pl_PL.txt"
}, 'aoColumns': [
null,
null,
null,
null,
null,
null,
{"bSortable": false},
{"bSearchable": false, "bSortable": false}
]
});
[/code]
My form action (each row have its mini form):
[code]
$('table').delegate('.btn16', 'click', function () {
$('.btn16').removeClass('btn_clicked');
$(this).addClass('btn_clicked');
});
$('table').delegate('.ajax-table-form', 'submit', function () {
var form = $(this);
var row = form.closest('tr');
var action = form.children('.btn_clicked').attr('value');
var tr = row.children('td');
var rowNumber = row.index();
var data = form.serialize() + '&submit=' + action;
// submit form to ajax controller
$.post(
'/admin/ajax/object/action',
data,
function(data){
if(data.status.error)
{
for(var i in data.status.error)
{
$.jGrowl(data.status.error[i]);
}
return false;
}
switch(action)
{
case "W??cz":
case "Wy??cz":
// todo effects
break;
case "Usu?":
// todo effects
break;
default:
console.log('invalid action');
}
oT.fnDeleteRow( rowNumber );
},
"json"
);
return false;
});
[/code]
PHP is correct. Only datatable is passing bad offset to PHP when refreshing I think.
This discussion has been closed.
Replies
Solved it. There is a bad logic in 1.7.4 (in 1.7.6 too). In line ~1639 we have:
[code]
/* Check for an 'overflow' they case for dislaying the table */
if ( oSettings._iDisplayStart >= oSettings.aiDisplay.length )
{
oSettings._iDisplayStart -= oSettings._iDisplayLength;
if ( oSettings._iDisplayStart < 0 )
{
oSettings._iDisplayStart = 0;
}
}
[/code]
This is always true! So no mather what You do, You will always decrement pagination ...
The simple sollution is to change
[code]if ( oSettings._iDisplayStart >= oSettings.aiDisplay.length )[/code]
to
[code]if ( oSettings.aiDisplay.length == 0 )[/code]
Why? Because oSettings.aiDisplay.length is storing current number of rows. If value is 0, then there will be no rows in current page and pagination should decrement. Simple ;)
Works like a charm - even on filtered data. It will decrement pagination only, if You delete last element in current subpage.
Example video:
http://www.screenr.com/th9
Maybe someone will fix it in datatables core? 1.7.7? ;)
Changing line 5200 (where the if condition has moved to) fixes the problem.