Refresh DataTable Completely?

kelelehead

Well I start using DataTables in my PHP application cause it looks so great and functionally, however I can't run it properly.

I use an ajax method to fill my tables dynamically, and dynamically I edit and delete rows using modals and at time of each operation I do a refresh in tables and render again with DataTables but I get all rows, it doesn't filter anymore until I click some tittle to sort.
[code]
//THIS IS MY TABLE



IDNameDescription








fill_table();
function fill_table(){
$.post("sourceinfo.php",function(data){
$("#tablebody").html(data);
render('mytable');
});
}
function render(id){
$(function(){
$('#'+id).dataTable({
"bJQueryUI": true,
"oLanguage": {
"sLengthMenu": "Mostrar _MENU_ renglones por pagina",
"sZeroRecords": "No se encontraron resultados...",
"sInfo": "Mostrando _START_ de _END_ de _TOTAL_ registros",
"sInfoEmpty": "Mostrando 0 de 0 de 0 registros",
"sInfoFiltered": "(Filtrado de _MAX_ registros)",
},
"sPaginationType": "full_numbers",
"sDom": 'T<"clear"><"fg-toolbar ui-widget-header ui-corner-tl ui-corner-tr ui-helper-clearfix"lfr>t<"fg-toolbar ui-widget-header ui-corner-bl ui-corner-br ui-helper-clearfix"ip>'
});
});
}
function edit_or_delete_row(id){
$.post("edit_delete.php",{id:id},function(data){
if(data=="ok"){
fill_table();
}
});
}

[/code]
So when I edit or delete a row.. if I had 1000 rows... at moment that I render the table again it show me all 999 rows without filters...
Did I miss a property at moment when I render the table? Thanks....

allan

> $("#tablebody").html(data);

See - http://datatables.net/faqs#append .

You should either destroy the old table ( fnDestroy ) or use the API to add new data. If you can have the server return the data as JSON rather than HTML then you could use fnReloadAjax to reload the data.

Allan

kelelehead

Hi Allan thank you so much for answer.. let me tell you that I use fnDestroy but I don't know if I'm using it properly cause I notice that It doesn't show me all the 1000 rows anymore.. Now it keep the property to show me 10 records.. but now if I delete the first row for example it doesn't remove it when I redraw it. Let me show the code...

[code]
function render(id){
$(document).ready(function(){
var oTable = $('#'+id).dataTable();
oTable.fnDestroy();
oTable = $('#'+id).dataTable({
"bJQueryUI": true,
"bDestroy": true,
"oLanguage": {
"sLengthMenu": "Mostrar _MENU_ renglones por pagina",
"sZeroRecords": "No se encontraron resultados...",
"sInfo": "Mostrando _START_ de _END_ de _TOTAL_ registros",
"sInfoEmpty": "Mostrando 0 de 0 de 0 registros",
"sInfoFiltered": "(Filtrado de _MAX_ registros)",
},
"sPaginationType": "full_numbers"
//"bServerSide": true
//"sDom": 'T<"clear"><"fg-toolbar ui-widget-header ui-corner-tl ui-corner-tr ui-helper-clearfix"lfr>t<"fg-toolbar ui-widget-header ui-corner-bl ui-corner-br ui-helper-clearfix"ip>'
});
//oTable.fnReloadAjax();
//oTable.fnDraw();
});
}
[/code]

I destroy the table and render again.. but it doesn't remove the records that I delete... Thanks