Individual column filtering using Select dropdowns w/ State Save losing values for Select dropdown

davezen1

I added individual column filtering with select dropdowns and everything works fine. I then turned on bStateSave and noticed when I submit the form the filtering remains which is correct. However, the filters only have the value that was selected before the form was submitted. Is there a work around?


My init and filtering code:
--
$(document).ready(function() {

/* Initialise the DataTable */
var oTable = $('#sdmfilesTable').dataTable( {
"sDom": "<'row'<'span8'l><'span8'f>r>t<'row'<'span8'i><'span8'p>>",
"sPaginationType": "bootstrap",
"aLengthMenu": [[-1, 100, 75, 50, 25], ["All", 100, 75, 50, 25]],
"iDisplayLength": 100,
"bStateSave": true,
//sort by month, file type, provider code, filename
"aaSorting": [[1, 'desc'], [0, 'asc'],[3,'asc'], [4,'asc']],
"aoColumnDefs":[{"bSearchable": false, "bVisible":false, "aTargets": [0]},
{"bSearchable": false, "bVisible":false, "aTargets": [1]},
{"bSearchable": false, "bVisible":false, "aTargets": [2]},
{"bSearchable": false, "bVisible":false, "aTargets": [14]},
{ "sType": "monthYear-sort", "aTargets":[1] }
],
"oLanguage": {
"sSearch": "Search All Columns:",
"sLengthMenu": "_MENU_ records per page"
}
} );


/* Add a filter select menu for each certain element in the table footer */
$("#filters th:eq(0), #filters th:eq(1),#filters th:eq(8) ").each(function ( i ) {
this.innerHTML = fnCreateSelect( oTable.fnGetColumnData(i), filterLabels[i] );
$('select', this).change( function () {
oTable.fnFilter( $(this).val(), i );
} );
} );