Home / Questions / 28993
Accepted
Emiliano Torres
Asked: 2020-10-21 06:38:29 +0800 CST 2020-10-21 06:38:29 +0800 CST

带有过滤器组合框的 Jquery 数据表

  • 772

我正在使用 jquery dataTables，我想在“搜索”之后为特定字段添加过滤器组合......这可能吗？我已经看到了一些示例，您可以在页脚、表格的每一列下方添加组合框并以这种方式进行过滤，但从美学上讲，我不喜欢它，此外，我只需要一个过滤器组合。

jquery

1 Answers

  1. Best Answer

    我对 jQuery 不是很好，但是您可以在表格顶部添加一个组合框，并在您更改它时触发一个事件。

       $(document).ready(function() {
      var table = $('#tablaDetalle').DataTable({
          "bPaginate": false,
          "bLengthChange": false,
          "bFilter": true,
          "bInfo": false,
          "bAutoWidth": false,
          initComplete: function() {
              var div = $('#tablaDetalle_wrapper');
              div.find("#tablaDetalle_filter").prepend("<label for='idDepartamento'>Departamento:</label><select id='idDepartamento' name='idDepartamento' class='form-control' required><option>Seleccione uno...</option><option value='1'>  FRITURAS</option><option value='2'>REFRESCOS</option></select>");
              this.api().column(0).each(function() {
                  var column = this;
                  console.log(column.data());
                  $('#idDepartamento').on('change', function() {
                      var val = $(this).val();
                      column.search(val ? '^' + val + '$' : '', true, false)
                          .draw();
                  });
              });
          }
      });
  });

    编辑：我将它添加到搜索字段的高度

    我把jsfiddle留给你

    • 3