Struggling with fnServerParams

Struggling with fnServerParams

rh0diumrh0dium Posts: 14Questions: 0Answers: 0
edited March 2012 in General
Hey all,

Using the great example provided to allow me to select multiple row items I want to first refine the list. Basically all I want to do is to send the data [code]{ 'builder_id' : }[/code] where N is the based off of a .change() event. I can't seem to get this last bit working. I don't desire to do bServerSide=True and the examples only show it enabled (I'm not sure if that is required or not).

Can someone please help me with this basic select to redraw the table based on a change of a select?

Thanks


[code]

var oTable;
var gaiSelected = [];

$(document).ready(function() {

/* Init the table */
oTable = $("#example").dataTable({
"bProcessing": true,
// "bServerSide": true,
"sAjaxSource": "{% url incentive_distribution_homes_ajax_list %}",
"fnServerParams": function ( aoData ) {
$('#id_customer').change(function () {
aoData.push( {'builder_id': $(this).val() } );
oTable.fnDraw();
});
},
"fnRowCallback": function( nRow, aData, iDisplayIndex ) {
if ( jQuery.inArray(aData[0], gaiSelected) != -1 )
{
$(nRow).addClass('row_selected');
}
return nRow;
},
"aoColumns": [
{ "bVisible": 0 }, /* ID column */
null,
null,
null,
null,
null
]
});

/* Click event handler */
$('#example tbody tr').live('click', function () {
var aData = oTable.fnGetData( this );
var iId = aData[0];
if ( jQuery.inArray(iId, gaiSelected) == -1 ) {
gaiSelected[gaiSelected.length++] = iId;
} else {
gaiSelected = jQuery.grep(gaiSelected, function(value) {
return value != iId;
} );
}
$('select[name=homes]').val(gaiSelected)
$(this).toggleClass('row_selected');
} );
});

[/code]

Replies

  • allanallan Posts: 63,506Questions: 1Answers: 10,471 Site admin
    Your change event is currently only getting applied when fnServerParams is called, and then is being applied every time it is called. I think you want this for your fnServerParams:

    [code]
    "fnServerParams": function ( aoData ) {
    aoData.push( {'builder_id': $('#id_customer').val() } );
    },
    [/code]

    And then put your change listener just after your table initialisation.

    Since you are using client-side processing, if you want to get new data from the server you will need to use the fnReloadAjax API plug-in.

    Allan
This discussion has been closed.