在DataTable JQuery中过滤精确的字符串

时间:2017-04-27 03:12:36

标签: javascript jquery datatables

如何在使用fnFilter尝试的JQuery Datable搜索栏中搜索完全匹配,但它仍未返回完全匹配。

  $(document).ready(function() {
    var oTable = $('#datacal_table').DataTable({"order": [[4, "asc"]]});
    oTable.fnFilter("^"+$(this).val()+"$", 4, true);
  });

例如,我只会注意搜索“活跃”,但会发生的是“非活动”字样也会返回结果。我该怎么办?我只需要搜索确切的字符串。

Post image

修改

我尝试了一个inuka的链接How to search for an exact string in a jQuery DataTable?

似乎我的课文干扰了搜索,我该如何解决这个问题呢?我想继续使用我的课文,以便它是彩色的。

<td id="status">
      <span class = "label {{ getStatusColor($data->status) }}"
       id    = "status_{{ $data->id }}">
       {{ getStatusText($data->status) }}
      </span>
</td>

当我只保留{{getStatusText}}时,搜索会有效,但当我尝试对其进行分类时,它不会。

<script type="text/javascript">
  $(document).ready(function() {
    var table = $('#datacal_table').DataTable({
      "order": [[4, "asc"]]
    });
    $('.dataTables_filter input', table.table().container())
    .off('.DT')
    .on('keyup.DT cut.DT paste.DT input.DT search.DT', function(e) {
      var term = $.trim(this.value);
      if (term !== ""){
        var termRegExp = new RegExp('^' + $.fn.dataTable.util.escapeRegex(term) + '$', 'i');

        $.fn.dataTable.ext.search.push(
          function (settings, data, dataIndex){
            var isFound = false;
            $.each(data, function (index, value) {
              if (termRegExp.test(value)){ isFound = true; }
              return !isFound;
            });
            return isFound;
          }
        );
      }

      table.draw();

      if (term !== "") {
        $.fn.dataTable.ext.search.pop();
      }
    });
  });
  </script>

2 个答案:

答案 0 :(得分:0)

试试这段代码

var oTable = $('.datatable').DataTable(); 
$('.dataTables_filter input').keyup( function () {
      oTable.fnFilter("^"+$(this).val(),0,true,false);
});

工作链接http://codepen.io/subbu1191/pen/GmrvNd

1.{string}: String to filter the table on
2.{int|null}: Column to limit filtering to
3.{bool} [default=false]: Treat as regular expression or not
4.{bool} [default=true]: Perform smart filtering or not
5.{bool} [default=true]: Show the input global filter in it's input box(es)
6.{bool} [default=true]: Do case-insensitive matching (true) or not (false)

为了让正则表达式正常工作,你必须将智能过滤设为假

答案 1 :(得分:0)

this帖子中的以下答案将为您提供在HTML表格结构中搜索字词的答案。

$('#datacal_table').DataTable({
   "columnDefs": [{
      "targets": [4],
      "render": function ( data, type, full, meta ) {
         if(type === 'filter'){
            return $('#datacal_table').DataTable().cell(meta.row, meta.col).nodes().to$().find('span').text();
         } else {
            return data;
         }
      }
   }]
});

根据Datatables documentation,此columnDefs.targets将为您提供仅匹配指定列名称值的选项。 "targets": [4]仅关注状态列下的值。