triggering the lengthMenu drop down change using script
triggering the lengthMenu drop down change using script
KarthikeyanS
Posts: 7Questions: 0Answers: 0
Hi,
I have a requirement to display the pagination ( with an input box to enter page numbers and next, prev links ) in the left side of the bottom band and length menu drop-down in the right side of the bottom band that is present below the data table. Hence i created a duplicate length menu drop down and bound its change event to trigger the change of original length menu drop-down ( whose visibility is set as hidden). This works fine in all my pages except one scenario. In case any notification has to be displayed to the user, it is loaded in a pop over. After closing this pop over, change of values in length drop-down doesn't reflect any change in table. By debugging my code using alerts, I got to know that the value in original drop down is changing in this scenario, but the " $(realRecPerPg).find('select').trigger('change'); " is not firing the change event only for this specific scenario
//to put the records per page drop down in bottom
[code]
"fnDrawCallback": function( oSettings ) {
var dupRecPerPg = $("#avail_certifications div.paginator_input_div label.rec_per_page");
var realRecPerPg = $('#avail_certifications div.dataTables_length label');
$(dupRecPerPg).html($(realRecPerPg).html());
$(dupRecPerPg).find('select').die('change');
$(dupRecPerPg).find('select').live('change',function(){
$(realRecPerPg).find('select').val($(this).val());
$(realRecPerPg).find('select').trigger('change');
});
$.uniform.update('select');
}
[/code]
Thanks,
Karthikeyan
I have a requirement to display the pagination ( with an input box to enter page numbers and next, prev links ) in the left side of the bottom band and length menu drop-down in the right side of the bottom band that is present below the data table. Hence i created a duplicate length menu drop down and bound its change event to trigger the change of original length menu drop-down ( whose visibility is set as hidden). This works fine in all my pages except one scenario. In case any notification has to be displayed to the user, it is loaded in a pop over. After closing this pop over, change of values in length drop-down doesn't reflect any change in table. By debugging my code using alerts, I got to know that the value in original drop down is changing in this scenario, but the " $(realRecPerPg).find('select').trigger('change'); " is not firing the change event only for this specific scenario
//to put the records per page drop down in bottom
[code]
"fnDrawCallback": function( oSettings ) {
var dupRecPerPg = $("#avail_certifications div.paginator_input_div label.rec_per_page");
var realRecPerPg = $('#avail_certifications div.dataTables_length label');
$(dupRecPerPg).html($(realRecPerPg).html());
$(dupRecPerPg).find('select').die('change');
$(dupRecPerPg).find('select').live('change',function(){
$(realRecPerPg).find('select').val($(this).val());
$(realRecPerPg).find('select').trigger('change');
});
$.uniform.update('select');
}
[/code]
Thanks,
Karthikeyan
This discussion has been closed.
Replies
Please help.
Allan
Karthikeyan