why checkall button at header always active on next pagination

why checkall button at header always active on next pagination

copsychuscopsychus Posts: 20Questions: 5Answers: 0

I'm really have no ideal when i select 1-2 rows on first page then move to next page, the check all button at header automatically actives then all rows in this new page also selected as well, is there a way to fix this ?

this is my datatable code:

var table = $('#tbGrid').DataTable({
                 responsive: true,
                ajax: {
                    url: '@Url.Action("ReceiveDocumentGrid")',
                    type: "POST",
                    datatype: "json"
                 },
                 columnDefs: [
                     {
                         width: "8%",
                         orderable: false,
                         targets: 0,
                         checkboxes: { selectRow: true, }

                     }
                 ],
                 dom: '<"top"pl>rit',
                 pagingType: "numbers",
                 pageLength: 1000,
                 lengthMenu: [[1000, 2000, 3000, 4000], [1000, 2000, 3000, 4000]],
                 select: {
                     style: 'multi',
                     selector: 'td:first-child',
                 },
                 autoWidth: false,
                 bInfo: true,
                 bStateSave: false,
                 order: [[1, 'asc']],
                 buttons: [],
                 initComplete: function (settings, json) {
                     $(".dt-buttons .btn").removeClass("btn-secondary")
                 },
                processing: false,
                serverSide: true,
                search: false,
                orderMulti: false,
                ordering: true,
                 paging: true,
                 columns: [
                     {
                        data: null,
                        name: null,
                        className: "col-header-center"
                    },
                    {
                        data: null,
                        name: null,
                        "width": "3%",
                        orderable: false,
                        title: "@Resources.Views.DocumentResource.Order",
                        render: function (data, type, row, meta) {
                            //var html = '<input type="hidden" id="hdnHeader_' + meta.row + '" name="hdnHeader_' + meta.row + '" class="form-control" autocomplete="off" value="' + row.ID + '">';
                            return meta.row + meta.settings._iDisplayStart + 1;
                        }
                    },
                    {
                        data: "ID",
                        name: "ID",
                        "width": "1%",
                        visible: false,

                    },
                    {
                        data: "ReceiveNo",
                        name: "ReceiveNo",
                        "width": "10%",
                        title: "@Resources.Views.DocumentResource.ReceiveNo"
                    },
                    {
                        data: "TestingNo",
                        name: "TestingNo",
                        "width": "10%",
                        title: "@Resources.Views.DocumentResource.TestingNo"
                    },
                     {
                         data: "GroupCategoryName",
                         name: "GroupCategoryName",
                        "width": "15%",
                        title: "@Resources.Views.DocumentResource.GroupCategory"
                    },

                    {
                        data: "SampleName",
                        name: "SampleName",
                        "width": "10%",
                        title: "@Resources.Views.DocumentResource.SampleName"
                    },
                    {
                        data: "CategoryName",
                        name: "CategoryName",
                        "width": "20%",
                        title: "@Resources.Views.DocumentResource.SampleDescription"
                     },
                    {
                        data: "CustomerName",
                        name: "CustomerName",
                        "width": "15%",
                        title: "@Resources.Views.DocumentResource.CustomerName"
                     },
                     {
                     data: "SubmitDate",
                        name: "SubmitDate",
                        "width": "10%",
                        title: "@Resources.Views.DocumentResource.ReceiveDate"
                     },
                     {
                        data: "FeeAmount",
                        name: "FeeAmount",
                        "width": "10%",
                        title: "@Resources.Views.DocumentResource.TotalAmount"
                     },
                     {
                         data: null,
                         name: null,
                         "width": "1%",
                         orderable: false,
                         render: function (d, t, r, m) {
                             var html = '<a href="#" class="addBox" title="ขึ้นด้านบน" ><i class="fa fa-arrow-circle-o-up" style="color:limegreen"></i></a>';

                             return html;
                         }
                     }
                 ],
                 rowCallback: function (row, data) {

                     if ($.inArray(data.ID, selected) !== -1) {
                         $(row).addClass('selected');
                         $(row).prop('checked', true);
                     }
                    
                 },
             });

Replies

This discussion has been closed.