How to have drop downs populate all options (server-side)

How to have drop downs populate all options (server-side)

wake-up-donniewake-up-donnie Posts: 2Questions: 1Answers: 0

I was wondering if anyone could help me get my dropdown selectors to populate all of the possible options? Currently they only populate what options are available on the first page after loading.

 $(document).ready(function() {

    $('#albums').DataTable( {

        "processing": true,
        "serverSide": true,
        "searching": true,
        "ajax": "/api/?format=datatables",

        "columns": [
            {"data": "type"},
            {"data": "name"}],

         initComplete: function () {
            this.api().columns().every( function () {
                var column = this;
                var select = $('<select><option value=""></option></select>')
                    .appendTo( $(column.footer()).empty() )
                    .on( 'change', function () {
                        var val = $.fn.dataTable.util.escapeRegex(
                            $(this).val()
                        );

                        column
                            .search( val ? '^'+val+'$' : '', true, false )
                            .draw();
                    } );

                column.data().unique().sort().each( function ( d, j ) {
                    select.append( '<option value="'+d+'">'+d+'</option>' )
                } );
            } );
        }


    } );
} );

Answers

  • wake-up-donniewake-up-donnie Posts: 2Questions: 1Answers: 0
    edited May 2019

    Solved:

    Needed to remove:

            "processing": true,
            "serverSide": true,
            "searching": true,
    

    Don't know why but it end up making it work

  • kthorngrenkthorngren Posts: 21,146Questions: 26Answers: 4,918

    Don't know why but it end up making it work

    With server side processing enabled only the page being displayed is in the client (web browser). Its used for large data sets to increase performance by reducing the amount of data at the client. With server side processing enable the better option would be to use search inputs.
    Otherwise you would need to provide the data needed for the options in a separate data set which might negate the benefit of server side processing.

    With server side processing disabled all the data is at the client allowing the above code to work.

    Kevin

This discussion has been closed.