Datatables populate after form post (Search and Sorting doesn't work anymore...)

Gynnad

I'm trying to do a form submit (POST) with some parameters and based on the parameters I want to populate my datatable. But I'm not very good with Javascript (My language is Java), so I'm trying to do it with an Ajax call. But it won't work for me. Everything works for me, except doing a POST with parameters to the servlet. The datatable always populate automatically, but it should populate after the form submit.

Does someone know an example of my case? I read a lot of form posts here and tutorials, but none of this case (?).

My code is now as follows, this works for me. Except I can't sort or search anymore in this table. What is missing?

Thank you.

[code]




Season:


Type:








Name
NationId
RegionId
Attendance



<!-- data goes here -->




$("#btnSubmit").click( function() {
var formData = "season=" + $("input#season").val() + "&type=" + $("input#type").val();
$('#example').dataTable( {
"bJQueryUI": true,
"bProcessing": true,
"bDestroy": true,
"sAjaxSource": "/servlets/service/competitions/",
"fnServerData": function ( sSource, aoData, fnCallback, oSettings ) {
oSettings.jqXHR = ${esc.d}.ajax( {
"dataType": 'json',
"type": "POST",
"url": sSource,
"data": formData,
"success": fnCallback
} );
}
} );
} );
[/code]

Gynnad

Could someone please help me out with this?