Column filter not updating values on pagelength change

andrevr

Hi

I have put a select dropdown outside my table which filters the region column. This works fine; the problem is that only the amount of values in the pagelength variable are populated. Say I have 50 regions, but on page load the pagelength is set to 20, then only a few regions will populate in the dropdown, and when the length is changed to 100, the amount of regions dont increase with it.

    initComplete: function () {
        this.api().columns('.select-filter').every( function () {
                var column = this;
            
                var select = $('<select class="form-control"><option value=""></option></select>')
                   .appendTo( $('.col-sm-6:eq(1)', table.table().container()))  // 
    .appendTo($(column.header()))
                    .on( 'change', function () {
                        var val = $.fn.dataTable.util.escapeRegex(
                            $(this).val()
                        );
 
                        column
                            .search( val ? '^'+val+'$' : '', true, false )
                            .draw();
                    } ); 

I need to have all the regions populated in the dropdown irrespective of the pagelength variable. Please note I am using server side processing.

Thanks!

colin

Hi @andrevr ,

This thread here will help, it's discussing the same issue.

Cheers,

Colin

andrevr

Hi @colin

Thanks for your advise, I dont understand it however. I am not very experienced in JavaScript and have build my own file mostly from online help so I dont know how exactly to implement the solution.