javascript - Jquery表过滤器修改

Question

我一直在使用下面的 Jquery Table 过滤器代码，它的工作原理完全符合我的需要。现在我需要添加两个我不知道该怎么做的选项。该过滤器仅在名为“Materials Ordered”的表列中进行过滤。如果它在 id=""中找到确切的文本，那就是显示的表行。

我需要添加以下内容，仍然只在同一列中查找:

1) 添加名为“Open”的新过滤器选项，该选项应该: - 显示除所有 4 种产品(后挡板、地毯、瓷砖和木材)均不适用或后面带有订单日期的记录之外的所有记录

2) 添加名为“Closed”的新过滤器选项，应显示: - 仅显示所有 4 种产品(后挡板、地毯、瓷砖和木材)的记录均不适用或包含订单日期

<input type="radio" id="" name="Materials Ordered" /> All
<input type="radio" id="Tile NOT" name="Materials Ordered" checked="checked">Tile
<input type="radio" id="Carpet NOT" name="Materials Ordered" /> Carpet
<input type="radio" id="Wood NOT" name="Materials Ordered" /> Wood
<input type="radio" id="Backsplash NOT" name="Materials Ordered" /> Backsplash

这是当前过滤的 fiddle :https://jsfiddle.net/aL6141dq/

<script>
$(document).ready(function () {

$('input[type="radio"]').change(function () {
var name = $('input[name="name"]:checked').prop('id') || '';
var position = $('input[name="Materials Ordered"]:checked').prop('id') || '';
$('tbody tr').hide();
$('tbody tr:contains(' + name + ')').show();
$('tbody tr').not(':contains(' + position + ')').hide();
});

});
</script>

这是第二个选项的要点:

(if Backspash tabletext = "Backspash mm/dd/yyyy" OR "Backspash N/A"
AND
if Carpet tabletext = "Carpet mm/dd/yyyy" OR "Carpet N/A"
AND
if Tile tabletext = "Tile mm/dd/yyyy" OR "Tile N/A"
AND
if Wood tabletext = "Wood mm/dd/yyyy" OR "Wood N/A")
{
SHOW Table Row)
}

Answer 1

嗯，我还没有测试过这个，但似乎你可以做如下的事情:

$('tbody tr').filter(function() {
  var matches = $(this).find('td').filter(function() {
    var val = $(this).text(),
        prefix = this.id.substring(0, this.id.length - 4) + ' ',
        datePattern = /^(\d{1,2})(\/|-)(\d{1,2})(\/|-)(\d{4})$/,
        suffix;

    if (val.substring(0, prefix.length) === prefix) {
        suffix = val.substring(prefix.length);
        if (suffix === 'N/A' || suffix.match(datePattern)) {
            return true;
        }
    }
    return false;
  }).length;

  return option === 'Closed' ? matches === 4 : matches !== 4;
}).show();

其想法是查看每行中的表格单元格，过滤符合条件的单元格，然后对结果进行计数。该代码通过从 ID 中删除尾随的“NOT”来提取有效值的开头(例如“Tile”)。然后它测试剩余的字符，看看它们是否是“N/A”或日期(显然可以进行更广泛的日期检查)。

然后可以检查一行中匹配单元格的数量，以查看哪些条件为真，并相应地 show() 它们。