Searchpanes Preselect not working

Chrishow

I'm using searchpanes but for some reason, the preselect option is not working. EVERYTHING works as intended except this.
This is my whole datatable init, could someone point me in the right direction?

$(document).ready( function () {
       var table = $('#exportable').DataTable({
        responsive: true,
        "order": [[ 5, "asc" ]],
             "language": {
       //"info": "<?php echo __('Página')?> _PAGE_ <?php echo __('de')?> _PAGES_",
       "search": "<?php echo __('Buscar:')?>",
       "lengthMenu": "<?php echo __('Mostrar')?> _MENU_ <?php echo __('registros')?>",
       "paginate": {
             "next": "<?php echo __('Siguiente')?>",
             "previous": "<?php echo __('Anterior')?>"
           },
           "sInfo": "Mostrando _END_  de _TOTAL_ registros",
           "sInfoFiltered": "(filtrado de _MAX_ registros)",
           "sZeroRecords": "No se encuentran registros"
        },
        searchPanes:{
            layout: 'columns-6',
            cascadePanes: true,
            controls: false,
        },
        dom: "<'row'<'col-md-5'l><'col-md-4'B><'col-md-3'f>>" +
"<'row'<'col-md-6'><'col-md-6'>>" +
"<'row'<'col-md-12't>><'row'<'col-md-12'Pip>>",
        buttons: [
            {
                extend: 'excelHtml5',
                exportOptions: {
                columns: ':not(.not-export)'}
            },
            {
                extend: 'pdfHtml5',
                orientation: 'landscape',
                pageSize: 'LEGAL',
                exportOptions: {
                columns: ':not(.not-export)'}
            },
            {
                extend:'print',
                exportOptions: {
                columns: ':not(.not-export)'}
            }
        ],
        initComplete: function () {
            $(".buttons-print").addClass("btn btn-secondary btn-sm");
            $('.buttons-print').html('<i class="fas fa-print"/> Imp')

            $(".buttons-excel").addClass("btn btn-success btn-sm");
            $('.buttons-excel').html('<i class="fas fa-file-excel"/> XLS')

            $(".buttons-pdf").addClass("btn btn-danger btn-sm");
            $('.buttons-pdf').html('<i class="fas fa-file-pdf"/> PDF')
        },
        

        columnDefs:[
            { 
                className: "not-export", 
                targets: [ 11 ] 
            },
            {
                searchPanes: {
                    preSelect:["disponible"],
                },
                targets: [ 9 ]
            },
            {
                searchPanes:{
                    show: true,
                },
                targets: [1,3,4,5,7,9]
            },
            {
                searchPanes:{
                    show: false,
                },
                targets: [0,2,6,8,10,11]
            }
        ],
    });
   table.searchPanes.container().prependTo(table.table().container());
});

Edited by Colin - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

sandy

Hi @Chrishow ,

That's strange, could you please link to a test case? Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Thanks,
Sandy