代码之家  ›  专栏  ›  技术社区  ›  David

将搜索应用于多个列

  •  1
  • David  · 技术社区  · 7 年前

    我使用的是DataTables版本1.10.16,目前有一个datatable已初始化为:

    // Setup the emails datatable
    var auto_responders = $('#auto_responders').DataTable({
      ajax: {
        url: "assets/php/get_auto_responders.php",
        dataSrc: ''
      },
      columns: [
        { data: 'user_first_name', title: 'User Name', createdCell:
      function (td, cellData, rowData, row, col) {
      $(td).text(cellData + ' ' + rowData['user_last_name']);
    }
    },
        { data: 'user_last_name', visible: false},
        { data: 'customer_first_name', title: 'Customer Name', createdCell:
      function (td, cellData, rowData, row, col) {
      $(td).text(cellData + ' ' + rowData['customer_last_name']);
    }
    },
        { data: 'customer_last_name', visible: false},
        { data: 'email', title: 'Email', createdCell:
      function (td, cellData, rowData, row, col) {
      $(td).html('<a href="mailto:' + cellData + '">' + cellData + '</a>');
    }
    },
        { data: 'customer_id', searchable: false, visible: false },
        { data: 'date_entered', title: 'Date Entered' },
        { data: 'title', title: 'Auto-Responder' },
        { data: 'queued_ids', title: 'Upcoming Responders', searchable: false, createdCell:
          function (td, cellData, rowData, row, col) {
            if (!cellData) {
        $(td).html('<span class="text-danger text-center d-block">No Automatic Responders Queued</span>');
      } else {
        $(td).html('<button type="button" class="btn btn-block btn-outline-success queued_auto_responders" data-queued-ids="' + cellData + '" data-toggle="modal" data-target="#modal_queued_responders">View Queued Automatic Responders</button>');
      }
          }
        }
      ]
    });
    

    正如您所知,在显示前两列(用户的名字和姓氏),然后是下两列(客户的名字和姓氏),但我将各自的姓氏列的可见性设置为false。

    要为网页上的用户创建下拉过滤器,以快速查看特定用户的所有行,我有以下代码:

    auto_responders.columns([0, 1]).search(filter).draw();
    

    价值在哪里 filter 等于用户的全名。我的问题是,通过指定前两列,我认为它会尝试将筛选器中的名称与用户的名字和姓氏相匹配,但当我尝试使用该代码时,不会返回任何行。如何根据第一列和第二列都包含至少一部分筛选器的位置将其返回行?

    1 回复  |  直到 7 年前
        1
  •  2
  •   hawkstrider    7 年前

    您可以使用datatables中的搜索api进行自定义搜索筛选

    $.fn.dataTable.ext.search
    

    这里的例子 Custom Filtering