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]