aoData undefined
aoData undefined
Hi,
I have a form above a table with some filter option to select data. The ajax source works fine and responds to querystring I send along (ajax_json_dt_planten.php?kleur=rood).
Loading the table initially works fine: all records are displayed. But I want the user to select a filter option in the form and reload the data. So why not include the form values right away?
I need some help with this since my aoData doesn't seem to work: the querystring to the ajax source always shows undefined=undefined.
This is what i have now:
[code]
var oTable = $("#plantenlijst").dataTable({
"bProcessing":true,
"sAjaxSource": "ajax_json_dt_planten.php",
"fnServerData": function (sSource, aoData, fnCallback ) {
aoData.push( {"kleur":$("#kleur").val()} );
$.getJSON( sSource, aoData, function (json) {
fnCallback(json)
} );
}
})
[/code]
This works and loads all data, although it should already take into account the value of "kleur", no?
There is a dropdown "kleur" (color) and I wrote an event handler for it:
[code]
$("#kleur").change(function(){
oTable.fnReloadAjax();
})
[/code]
The plug-in function reloadJax is loaded.
Where I am I going wrong? can I use $('form').serialize() to populate aoData?
thanks for the help, Jan
I have a form above a table with some filter option to select data. The ajax source works fine and responds to querystring I send along (ajax_json_dt_planten.php?kleur=rood).
Loading the table initially works fine: all records are displayed. But I want the user to select a filter option in the form and reload the data. So why not include the form values right away?
I need some help with this since my aoData doesn't seem to work: the querystring to the ajax source always shows undefined=undefined.
This is what i have now:
[code]
var oTable = $("#plantenlijst").dataTable({
"bProcessing":true,
"sAjaxSource": "ajax_json_dt_planten.php",
"fnServerData": function (sSource, aoData, fnCallback ) {
aoData.push( {"kleur":$("#kleur").val()} );
$.getJSON( sSource, aoData, function (json) {
fnCallback(json)
} );
}
})
[/code]
This works and loads all data, although it should already take into account the value of "kleur", no?
There is a dropdown "kleur" (color) and I wrote an event handler for it:
[code]
$("#kleur").change(function(){
oTable.fnReloadAjax();
})
[/code]
The plug-in function reloadJax is loaded.
Where I am I going wrong? can I use $('form').serialize() to populate aoData?
thanks for the help, Jan
This discussion has been closed.
Replies
[code]
...
"fnServerData": function (sSource, aoData, fnCallback ) {
// aoData.push( {"kleur":$("#kleur").val()} ); // WRONG
// aoData.push( {"name":"kleur","value":$("#kleur option:selected").val()} ); // OK but aoData is null ERROR
$.getJSON( sSource, [ {"name":"kleur","value":$("#kleur option:selected").val()} ], function (json) {
//OK, WORKS
fnCallback(json)
} );
},
...
[/code]
There seem to be a problem with the initialisation of aoData: one can't push because you get teh error "oaData is null".
Hope this helps someone. It helped myself...
Do you have this as well? the moment you click the send button... the light goes on in your head...
cheers
[code]
"fnServerData": function (sSource, aoData, fnCallback ) {
$.getJSON( sSource, $('form').serializeArray(), function (json) {
fnCallback(json)
});
},
[/code]
Preffer a 'concat array' rather than a hard replacing aoData (you won't loose all automatic Datatable parameters...)
[code]
"fnServerData": function ( sSource, aoData, fnCallback ) {
//aoData = aoData.concat( $("#statsOptions").serializeArray() );
$.getJSON( sSource, aoData.concat( $("#statsOptions").serializeArray() ), function (json) {
/* Do whatever additional processing you want on the callback, then tell DataTables */
fnCallback(json);
} );
}
[/code]
thanks for your suggestion and with the initialisation code aoData.concat works: I can see the array aoData has increased in size. But as soon as I use oTable.fnReloadAjax(), aoData seems to vanish into thin air: "aoData is null".
Possible solution?
I checked the fnReloadAjax plugin function and changed the null in the function arguments to [ ]:
[code]
oSettings.fnServerData( oSettings.sAjaxSource, [], function(json) {
/* Clear the old information from the table */
that.oApi._fnClearTable( oSettings );
...
[/code]
this seems to do the trick. so I can now use aoData.concat
How do you feel about thius solution?
Jan
If you pass to fnServerData an empty array ([]) i am not sure that you will concat to anything ?
For my part, I don't use fnReloadAjax anymore, I don't need it in fact (I thought, but I was wrong).
Perhaps it is the case for you ? I explain my need :
I have a filter tab that act on ajax request (more where clauses to pass to my server query) and I wanted a refresh every time a combo/text input changed. I just need to catch the change event on this form and perform a refresh on the table.
So with the serialized content of my form added to the regular datatable parameters, I have on my back end php code enough informations to build the sql where clause.
What was youre need ?
Eric.
Could you explain how you perform that refresh as you are talking above?
Thanks
Allan