ajax reload is not sending updated params

xnrsisbi

Hello,

i'm trying to update data in the table based on the selected option in a html select field but it's not working properly.
Lets see i have the folowing:

<script type="text/javascript" language="javascript" class="init">

(function($){

$(document).ready(function() {  

    var warehouseID = document.getElementById("selectWarehouse").value;

    var table = $('#XNR').DataTable( {
        dom: 'Tlf<"clear">rtip',
        //serverSide: true,
        ajax: {
            url: "php/getInventories.php",
            type: "POST",
            data: {ware: warehouseID , uid: '<?php echo $uid; ?>' }
        },
        columns: [
            { data: "ProdPhoto" },
            { data: "ProdName" },
            { data: "Inventory" },
            { data: "PriceIn" }
        ],
        pagingType: "full_numbers",
        lengthMenu: [[10, 25, 50, -1], [10, 25, 50, "All"]],
        order: [ 3, 'asc'],
                
        tableTools: {
        sRowSelect: "os",
        sSwfPath: "libraries/DataTables/extensions/TableTools/swf/copy_csv_xls_pdf.swf",
        aButtons: [         
                {
                    sExtends: 'collection',
                    sButtonText: 'Export',
                    aButtons: [
                        'copy',
                        {
                                sExtends: "pdf",
                                mColumns: "visible",
                                sPdfOrientation: "landscape"
                            },
                            {
                                sExtends: "xls",
                                mColumns: "visible"
                            },
                        'print'
                    ]
                }                   
            ]
        }
    } );
    
    $('#selectWarehouse').change(function() {
        warehouseIDReload = document.getElementById("selectWarehouse").value;
        //table.ajax.reload();
        table.ajax.url('php/getInventories.php?ware='+warehouseIDReload+'&uid="<?php echo $uid; ?>"').load();
    } );
    
} );

}(jQuery));
</script>

The idea here is to reload the data on the table based on user selection on the dropdown, when i change the option on dropdown i can see in firebug that:

getInventories.php?ware=wrh_web_SCkUDn**UcJumUYsQABg

was sent but when i check the post parameters i see:

getInventories.php?ware=all (which is the first value sent on load)

so even if i use the table.ajax.url with new parameters they seem to be wiped out and initial params used when the load() option is called.
Does anyone have an explanation for this and how to deal with it so i can update my data completly when a dropdown is changed?

allan

You need to use ajax.data as a function. At the moment it is only being evaluated when the table is initialised. See ajax.data for more information.

Allan

xnrsisbi

Thank you for your comment,
if i understand correctly i need to do something like this:

$('#selectWarehouse').change(function() {
        warehouseIDReload = document.getElementById("selectWarehouse").value;
        table.ajax.data({ware: warehouseIDReload , uid: '<?php echo $uid; ?>'});
        
    } );

is this correct? i'm not sure it is since function data needs two paremeters and i only send one, not sure what to send in the 'settings' part of the function.
Can you please help me out with this?

thanks in advance

allan

No, have a look at the second example in the "Examples" section of the ajax.data documentation that I linked to. That shows how you can use that option as a function.

Allan

xnrsisbi

so for those with the same problem, here's how to achieve this:

var table = $('#XNR').DataTable( {
        ajax: {
            url: "php/getInventories.php",
            type: "POST",
            data: function ( d ) {
                d.ware = document.getElementById("selectWarehouse").value ,
                d.uid = '<?php echo $uid; ?>';
            }
        }, ...

and in the change function (below the DataTable implementation):

$('#selectWarehouse').change(function() {
        table.ajax.reload();
    } );

thanks Allan for your support :-)

Can close this thread now