数据表精确单词搜索

2023-12-04

嗨,我正在使用数据表我想用一个确切的词过滤我的数据。

我的表格数据如下所示;

+-----+----------+
| num | status   |
+-----+----------+
| 1   | Active   |
+-----+----------+
| 2   | Inactive |
+-----+----------+
| 3   | Active   |
+-----+----------+

每当我寻找Active我也看到了所有Inactive也。有什么方法可以过滤此内容,以便状态列仅显示确切的单词。

我的JS如下;

$(document).ready(function() {
    var table = $('#items').DataTable( {
    select: true,
    responsive: true
    } );
} );

我一直在阅读API但我不太明白它的意义。也许我需要写一些正则表达式?

有一个例子(我认为)here,但是我需要根据我的需要修改它。

任何帮助或建议将不胜感激。


如果你认为你的情况更好自定义过滤器为了这个任务。unbind默认处理程序并每次执行精确匹配过滤器。如果你有一张桌子

var table = $('#example').DataTable()  

然后以这种方式使用完全匹配自定义过滤器

$('.dataTables_filter input').unbind().bind('keyup', function() {
   var searchTerm = this.value.toLowerCase()
   if (!searchTerm) {
      table.draw()
      return
   }
   $.fn.dataTable.ext.search.push(function(settings, data, dataIndex) {
      for (var i=0;i<data.length;i++) {
         if (data[i].toLowerCase() == searchTerm) return true
      }
      return false
   })
   table.draw();   
   $.fn.dataTable.ext.search.pop()
})

这是一个演示->http://jsfiddle.net/hmjnqjbs/1/尝试搜索tokyo.


好的。我意识到问题不是关于精确匹配过滤器中的“精确单词”,而是更多的全单词搜索。我们想看到Vaio Q900当我们搜索vaio,但我们不想看到VaioQ900因为Vaio这里not是一个完整的词。这个问题可以通过使用正则表达式单词边界简单地解决\b :

$('.dataTables_filter input').unbind().bind('keyup', function() {
   var searchTerm = this.value.toLowerCase(),
       regex = '\\b' + searchTerm + '\\b';
   table.rows().search(regex, true, false).draw();
})

下面评论中OP的小提琴已更新->http://jsfiddle.net/hmjnqjbs/3/

Now active, vaio等等按预期工作。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

数据表精确单词搜索 的相关文章

  • JQuery Mobile - 内联显示 HTML 表单

    Goal 在 Jquery Mobile 中的同一行显示文本框和提交按钮 Problem 它们不会显示在同一行 我曾多次尝试在同一行显示文本框和提交按钮 但它从未起作用 这是我的代码和我使用的组合
  • 完整日历 - 向事件对象添加额外属性

    可能是由于我缺乏理解 但我使用 PHP 返回 JSON 字符串来带回事件数据
  • 获取变量的名称属性[重复]

    这个问题在这里已经有答案了 我想知道是否可以在 javascript 或 JQuery 中获取变量的名称 假设我在 javascript 中声明一个变量 如下所示 var customerNr 456910 如果函数接收变量 我如何返回变量
  • 有什么方法可以在 Django 中序列化分页对象吗?

    我正在使用 Django 分页和 jQuery 我可以序列化分页对象的对象列表 但我想序列化整个对象以获取更多数据 页码 总页数 如何序列化整个分页对象 Thanks javascript function getRestaurants q
  • 在一个区域显示隐藏 div

    我一整天都在寻找与我想要的东西相匹配的东西 但我在任何地方都找不到任何东西 我想创建一个显示隐藏 div 在一个固定区域显示 隐藏 div 我想要在页面的一半上有一个拇指图库 在页面的另一半上我想显示与该拇指相关的完整配置文件 因此当我单击
  • .NET Regex Negative Lookahead - 我做错了什么?

    假设我有 StartTest NoInclude EndTest StartTest Include EndTest 并正在使用 StartTest NoInclude s S EndTest g 为什么我要匹配这两个组 正则表达式示例 h
  • 使用相同图像映射的多个图像 - 如何在单击时返回正确的图像参考?

    我在一个页面上有多个图像 所有图像都使用相同的图像映射 我需要知道用户点击了哪个图像 问题是 this 返回对的引用 area 而不是 img 这是代码 img src image png img src image png img src
  • 使用 jQuery 选择焦点文本在 Safari 和 Chrome 中不起作用

    我有以下 jQuery 代码 类似于这个问题 https stackoverflow com questions 480735 在 Firefox 和 IE 中工作 但在 Chrome 和 Safari 中失败 没有错误 只是不起作用 有解
  • JSF ConvertDateTime 与数据表中的时区

    尝试输出数据表中的项目列表 如下所示
  • 函数的通用 .length 检查

    当我用 JS 或 jQuery 编写函数并且需要参数时 我使用if something length诡计 this example function e if e length blablabla else return false 但我不
  • 未捕获的引用错误:i 未定义

    我正在尝试在我的数组上创建一个 for 循环 var lists a b c d JS for i 0 i lt lists length i console log lists i sa report btn lists i click
  • JSON字符串转JS对象

    我正在使用 JS 对象通过 Google 可视化创建图表 我正在尝试设计数据源 首先 我在客户端创建了一个 JS 对象 var JSONObject cols id date label Date type date id soldpenc
  • URL 的正则表达式

    我已经编写了正则表达式来验证 URL 它可以是这样的 example com www example com http www example com http www example com https www example com h
  • 如何让更大的布局适合小设备屏幕?

    我有一个小问题meta viewport元素 问题是我的布局min width比我想要使用的许多屏幕分辨率都要大 所以将其设置为 没有帮助 结果我得到的页面必须缩小以适应设备宽度 如果我什至添加像 它也不起作用 发现了一个黑客来自CSS 技
  • 如何按日期升序对对象进行排序?

    如果我有一个对象列表 var objectList LIST OF OBJECT each object列表中包含三个属性 name date gender 如何按 对列表中的对象进行排序date 属性升序 the date 属性包含字符串
  • jquery 验证最小长度规则不起作用

    我有一个带有密码字段的表单 密码长度必须至少为 8 个字符
  • AngularJS 与(Angular JS + jQuery)

    我有一个关于仅使用 AngularJS 和纯 JavaScript 以及使用 AngularJS 和 jQuery 时的性能问题 ex app directive fitHeight function window return restr
  • bootstrap-datetimepicker 仅显示日期

    我正在用这个repo https github com smalot bootstrap datetimepicker由 smalot 提供 我只想选择并显示日期 对于其他一些地方 我显示数据和时间 因此选择此存储库 我可以设法仅使用它来选
  • Twitter 引导选项卡和 JavaScript 事件

    我正在一个项目中使用 twitter bootstrap 特别是它的选项卡功能 http twitter github com bootstrap javascript html tabs http twitter github com b
  • 显示对象内容 - JS/jQuery

    With this data events 返回 object Object 我需要看看里面到底发生了什么 我找到了这个 var Finder each this data events function i n Finder Name i

随机推荐