Фильтр столбцов с данными, например фильтр столбцов Excel

вы можете попробовать этот код ниже, чтобы реализовать фильтр в активном неактивном поле:

$(document).ready(function() {
  var dataTable = $("#DATATABLE").DataTable({
    serverSide: true,
    filter: true,
    searchDelay: 1000,
    scrollY: StaticData.TABLE_HEIGHT + 'px',
    lengthMenu: StaticData.TABLE_PAGE_SIZE,
    scrollCollapse: true,
    ajax: {
      url: '/STUD_MANAGEMENT/LoadStudents',
      type: 'GET',
      datatype: 'json',
      headers: { 'RequestVerificationToken': 'your json token' },
      dataSrc: function(json) {
        json = json.data;
        for (var i = 0, ien = json.length; i < ien; i++) {
          // Set the checkbox to be checked if Is_Active is true
          json[i]['isactive'] = '<input type = "checkbox" ' + (json[i].Is_Active ? 'checked' : '') + '>';
        }
        return json;
      }
    },
    columnDefs: [{ className: "dt-center", targets: [7], width: '2%' }],
    columns: [
      { data: 'STUD_ID', title: 'StudID', autoWidth: false, visible: false },
      { data: 'NAME', title: 'Name', autoWidth: true },
      { data: 'CLASS', title: 'Class', autoWidth: true },
      { data: 'isactive', title: 'Is Active?', autoWidth: false, orderable: false },
      { data: 'USER', title: 'User', autoWidth: true },
      { data: 'DATE', title: 'Date', autoWidth: true },
    ],
    headerCallback: function(thead, data, start, end, display) {
      $(thead).find('th').eq(3).html(
        '<div>' +
          '<input type = "checkbox" id = "filter-active" /> Active<br>' +
          '<input type = "checkbox" id = "filter-non-active" /> Non Active<br>' +
          '<input type = "checkbox" id = "filter-all" checked /> ALL' +
        '</div>'
      );
    },
    drawCallback: function(settings) {
      //Code to update checkbox state based on current filters
    }
  });

  $(document).on('change', '#filter-active', function() {
    // Apply filter for active
  });

  $(document).on('change', '#filter-non-active', function() {
    // Apply filter for non-active
  });

  $(document).on('change', '#filter-all', function() {
    // Apply filter for all
  });

  // Handle row checkbox changes if needed
  $('#DATATABLE tbody').on('change', 'input[type = "checkbox"]', function() {
    //Get row data
    var data = dataTable.row($(this).parents('tr')).data();
    //Change Is_Active status
    var isActive = this.checked;
    //AJAX call to update the server-side data
    console.info('Student ID: ' + data.STUD_ID + ' is now ' + (isActive ? 'active' : 'non-active'));
    //Server update code
  });
});