Search parameters ignored when using StateSave

Search parameters ignored when using StateSave

mattg10mattg10 Posts: 1Questions: 1Answers: 0

I have a datatable setup where I use the StateSave to display a child row, that works as expected but I want to also initially filter the data which looking at the docs I should use something like this

        search : {
                 search : 'bob'
        }

Which should load the table but be filtered by the word bob.

When I add the search to the datatable definition and load the page the search is being ignored and it loads the table unfiltered. If I remove the stateSave: true then the filtering works.

I would like to use the saveState and filtering together, am I doing something wrong?

My table setup is like this:

  var pendingTable = $('table.pending-claim-items').DataTable({
            bInfo: false,
            bLengthChange: false,
            autoWidth: false,
            stateSave: true,
            rowId: 'id',
            search : {
                search : '<?php echo $brokerName; ?>'
            },
            columnDefs: [
                {
                    targets: [2],
                    orderable: false
                }
            ],
            data: pendingItems,
            columns: [
                {
                    title: 'Category',
                    data: 'category',
                    width: "12%"
                },
                {
                    title: 'Sub Category',
                    data: 'subCategory',
                    width: "12%"
                },
                {
                    title: 'Date Entered',
                    data: 'dateEntered',
                    width: "10%",
                    className: 'text-center'
                },
                {
                    title: '',
                    data: 'status',
                    width: "7%"
                },
                {
                    title: 'Payment Type',
                    data: 'paymentType',
                    width: "16%"
                },
                {
                    title: 'Amount <span class="fs-7"> (%)</span>',
                    data: 'amountDue',
                    width: "12%",
                    className: 'text-end'
                },
                {
                    title: 'Reference',
                    data: 'reference',
                    width: "12%"
                },
                {
                    title: 'Comment',
                    data: 'commentButton',
                    width: "5%",
                    className: 'text-center'
                }
            ]
        });

Answers

  • rf1234rf1234 Posts: 2,787Questions: 85Answers: 404

    When using stateSave the search field is loaded as a parameter on state loading. Hence your init value above is being ignored.

    You would need to set the value on state loading.

    I have the opposite requirement for all of my state saving dts I don't want any previous search strings to be loaded. Hence this is part of my default settings for all of my data tables. The parameter is "data.search.search". I check for "undefined" because the default settings seem to be executed multiple times and sometimes with garbage in the parms. This way I got it to work.

    $.extend( true, $.fn.dataTable.defaults, {
        stateLoadParams: function (settings, data) {
            if ( typeof data !== 'undefined' ) {
                if ( typeof data.search !== 'undefined') {
                    data.search.search = "";
                }
                if ( typeof data.select !== 'undefined') {
                    data.select.rows = [];
                }
                if ( typeof data.order !== 'undefined') {
            //passing an empty array will lead to no ordering at all
            //deleting will allow for the default table ordering
                    delete data.order;
                }
            }
        },
    

    https://datatables.net/reference/option/stateLoadParams

Sign In or Register to comment.