【发布时间】：2018-06-18 13:53:24
【问题描述】：
我有一张表，我想对其应用过滤。用户可以选择基于以逗号分隔的多个术语进行过滤。这些条款将成为 OR 条件。我还希望用户能够在两个术语之间加上一个加号并将其作为“与”条件。
例如：
|---------------------|------------------|------------------|
| ID | NAME | DEPT |
|---------------------|------------------|------------------|
| 1 | BOB | Sales |
|---------------------|------------------|------------------|
| 2 | SALLY | Sales |
|---------------------|------------------|------------------|
| 3 | BOB | HouseKeeping |
|---------------------|------------------|------------------|
| 4 | SALLY | HouseKeeping |
|---------------------|------------------|------------------|
现在，如果我输入以下搜索词：BOB、SALLY+HOUSEKEEPING
我想要以下结果
|---------------------|------------------|------------------|
| ID | NAME | DEPT |
|---------------------|------------------|------------------|
| 1 | BOB | Sales |
|---------------------|------------------|------------------|
| 3 | BOB | HouseKeeping |
|---------------------|------------------|------------------|
| 4 | SALLY | HouseKeeping |
|---------------------|------------------|------------------|
如上所述，逗号充当“OR”运算符，加号充当“AND”运算符。
我已经使用以下代码完成了这项工作，但我遇到了一些我不知道如何解决的问题。也许我没有正确执行此操作，如果是，请告诉我并指出正确的方向。
下面的代码会给我我想要的结果，只要它们按这个顺序排列。即searchterm1，searchterm2+searchterm3
$("#myInput").on("keyup", function () {
var value = $(this).val().trim().toLowerCase();
var orConditions;
var andConditions;
if (value.indexOf(',') > -1) {
orConditions= value.split(',');
orConditions= orConditions.filter(r=>r != '');
}
$("#myTable tr").filter(function () {
$(this).hide().css('.excludeFromFilter');
});
$("#myTable tr").not('.excludeFromFilter').filter(function () {
if (value != '') {
if (orConditions) {
var length = orConditions.length;
var containsText = false;
while (length--) {
if (orConditions[length].indexOf('+') > -1) {
andConditions = orConditions[length].split('+');
andConditions = andConditions.filter(r=>r != '');
if ($(this).text().toLowerCase().indexOf(andConditions[0]) > -1 &&
$(this).text().toLowerCase().indexOf(andConditions[1]) > -1) {
containsText = true;
}
else {
containsText = false;
}
}
else {
if ($(this).text().toLowerCase().indexOf(orConditions[length]) > -1) {
containsText = true;
}
}
}
$(this).toggle(containsText);
}
else {
$(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
}
}
else {
$(this).show().not('.excludeFromFilter')
}
});
var $table = $('.transSummary1');
$table.floatThead('reflow');
});
我面临的问题是：
- 如果第一项是“与”条件，则所有行都被隐藏（我知道这是因为“+”仅在存在“或”条件时才被考虑，但不知道如何解决所以不管哪个是第一个，即'OR'或'AND'）
- 如果我在“AND”之后添加另一个“OR”词，则不会考虑这个词
- 如何修改它以允许两个以上的“AND”条件，即 searchterm1+searchterm2+searchterm3
对此的任何帮助将不胜感激。
【问题讨论】：
-
如果我提供的答案对你有用，请告诉我。如果你在过去 30 分钟内看过它，就知道我已经修改了几次。我已经提交了最终修改。
标签： javascript jquery html-table tablefilter