$(document).ready() makes datatable not work properly

rogcg

I'm trying to start the table empty with no data in [code][/code] and choose some parameters send to the server via $.getJSON and append the returned json data inside [code][/code].

But it looks like because of the $(document).ready() it makes it not work properly, the pagination and the search stop working completely. Here is my code:

BTW, I'm including all the needed files, I know that the error is because I'm populating the table after the page loads, I just would like to know if there is another approach to solve this problem.

[code]


$(document).ready(function()
{
$('#contacts').dataTable({
"sPaginationType" : "full_numbers"
});

$("#submit").click(function()
{
$.getJSON("/myurl",
function(data)
{
$("#table_body").empty();
$.each(data, function(i, item)
{
total += item.duration;

$("#table_body").show("slow");
$("#table_body")
.append(
'' +
'' + item.name+ '' +
'' + item.birthdate + '' +
'' + item.age + '' +
''
);
});
});
});
});


<!-- NOW THE HTML CODE FOR THE TABLE -->




Name
Birthdate
Age





Name
Birthdate
Age



[/code]

allan

You need to use the DataTables API if you want to add new records to an existing table - have a look at the fnAddData API method.

Allan

rogcg

[quote]allan said: You need to use the DataTables API if you want to add new records to an existing table - have a look at the fnAddData API method.[/quote]

Thanks Allan. It worked!