table.rows().select() not working after I destroy and re create the table

nvagadiya

$(function () {
loadDatatable("intervention");
loadDatatable("monthly");
loadDatatable("semi_annually");
});

    function filterMethod(type) {
        const form = document.querySelector('#filterForm' + type);
        const data = Object.fromEntries(new FormData(form).entries());
        $(".datatable-" + type + "Kpi").DataTable().destroy();
        loadDatatable(type, data)
    }

    function loadDatatable(type, formData = null) {
        @if(auth()->user()->isSupplier)
            columnDefs = [
                {
                    orderable: false,
                    className: 'select-checkbox',
                    targets: 0,
                    defaultContent:""
                }
            ];
            columnList = [
                {
                    orderable: false,
                    className: 'select-checkbox',
                    targets: 0
                },
            ];
            selectDefs = {
                style: 'multi',
                selector: 'td:first-child'
            };
        @else
            columnDefs = []
            columnList = [];
            selectDefs = false;
        @endif
        columnList.push({orderable: false, data: 'full_name', name: 'full_name'},
            {orderable: false, data: 'type', name: 'type'},
            {orderable: false, data: 'contract_description', name: 'contract_description'},
            {orderable: false, data: 'conditional_column', name: 'conditional_column'},
            {orderable: false, data: 'under_threshold', name: 'under_threshold'},
            {orderable: false, data: 'value', name: 'value'},
            {orderable: false, data: 'status', name: 'status'});
        @if(auth()->user()->isSupplier)
            columnList.push(
                {
                    orderable: false,
                    data: 'action',
                    name: 'action'
                }
            )
        @endif
        var table = $('.datatable-' + type + 'Kpi').DataTable({
            processing: true,
            serverSide: true,
            pageLength: 25,
            ajax: {
                url: type === "intervention" ? "{{ route('kpi.getIntervention') }}" : (type === "monthly" ? "{{ route('kpi.getMonthly') }}" : (type === "semi_annually" ? "{{ route('kpi.getSemiAnnually') }}" : "")),
                data: {formData: formData}
            },
            columnDefs: columnDefs,
            select: selectDefs,
            buttons: dtButtons,
            destroy: true,
            columns: columnList
        });
        table.on("click", "th.select-checkbox", function () {
            if ($("th.select-checkbox").hasClass("selected")) {
                table.rows().deselect();
                $("th.select-checkbox").removeClass("selected");
            } else {
                table.rows().select();
                $("th.select-checkbox").addClass("selected");
            }
        }).on("select deselect", function () {
            ("Some selection or deselection going on")
            if (table.rows({
                selected: true
            }).count() !== table.rows().count()) {
                $('.checkboxhide').show();
                $("th.select-checkbox").removeClass("selected");
            } else {
                $('.checkboxhide').hide();
                $("th.select-checkbox").addClass("selected");
            }
        });
        table.on( 'page.dt', function () {
            $('.checkboxhide').show();
            $("th.select-checkbox").removeClass("selected");
        } );
    };

So here on load the select all checkbox is working and selecting but when it comes from filter function (destroy and re create)
than the table.rows().select() not working

colin

We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. 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.

Cheers,

Colin