使用tablesorter自定义解析器仅用于使用复选框过滤-需要工作示例 [英] Using tablesorter custom parser only for filtering with Checkboxes - working example needed

问题描述

当他发布使用tablesorter自定义解析器仅用于过滤时，我试图实现与Ivan类似（或完全类似？）的复选框选中状态的过滤。我反复讨论了自定义解析器和文本提取，以及文档中提供的示例中的所有排列都无济于事。
有人可以看一下我发布在
上的示例吗 http://jsfiddle.net/5fLr7c4o/ 14 /
并帮助我使其正常工作吗？
我正在使用该示例和其他示例中提供的标头和textExtraction函数：

I am trying to implement filtering my checkbox checked status similar to (or exactly like?) Ivan when he posted "Using tablesorter custom parser only for filtering". I've gone back and forth on custom parsers and text extraction and every permutation from the examples provided in the docs to no avail. Could someone look at my example posted at http://jsfiddle.net/5fLr7c4o/14/ and help me get it working? I'm using the headers and textExtraction function provided in that and other examples:

            headers: {
            0: {
                sorter: 'false',
                filter: 'parsed'
            }
        },
        textExtraction: {
            0: function (node, table, cellIndex) {
                return $(node).find('.MyCheckbox').prop('checked') ? 'True' : 'False';
            }
        }

要简单地说，我有两个按钮。一个过滤器会在未选中该复选框的情况下过滤所有内容，另一个过滤器会重置过滤器。重置工作正常。过滤器（在我的本地文件中）过滤所有内容。 jsfiddle根本不起作用。

To boil it down, I have two buttons. One will filter anything without the checkbox checked, the other resets the filter. The reset is working fine. The filter (in my local file) filters everything. jsfiddle doesn't work at all.

推荐答案

jsFiddle无法正常工作，因为在插件之后加载了jQuery。而且该框架已设置为加载jQuery v1.11.0，因此jQuery实际上已加载了两次。第二个副本覆盖第一个副本，并且表排序器与第一个副本相关联。很多东西中断了-这是演示已更新以删除第二个副本-但是仍然不起作用！

The jsFiddle isn't working because jQuery is being loaded after the plugin. And the framework is set to load jQuery v1.11.0, so jQuery is actually being loaded twice. The second copy overrides the first and the tablesorter is associated to the first copy. Lots of stuff break - here is the demo updated to remove the second copy - but it still doesn't work!

如果您使用 parser-input-select.js 文件包含在存储库中，有一个复选框解析器，它可以在更改后更新单元格，因此排序可以正确更新。无论如何，有四个版本的代码，较旧的版本则不使用上述解析器。您可能对此感兴趣的演示是这样的： http://jsfiddle.net/abkNM/6163/您可能不需要寻呼机，因此只需不要包含该代码：

If you use the parser-input-select.js file included in the repository, it has a checkbox parser that updates the cell after changing so the sort updates properly. Anyway, there are four versions of the code, the older ones don't use the mentioned parser. The demo you might be interested in is this one: http://jsfiddle.net/abkNM/6163/ You probably don't need the pager, so just don't include that code:

$(function() {
    var $table = $('table').tablesorter({
        theme: 'blue',
        widgets: ['zebra', 'filter'],
        widgetOptions : {
            group_checkbox: [ "checked", "unchecked" ]
        },
        headers: {
            0: { sorter: 'checkbox' }
        }
    })
    // HEADER CELL Checkbox - toggles state of visible checkboxes
    // make sure to include the "parser-input-select.js" file
    // it contains the most up-to-date checkbox parser
    .on('change', 'thead input[type="checkbox"]', function(){
        var checkboxColumn = 0,
            onlyVisible = true,

            $this = $(this),
            isChecked = this.checked;
        $table
            .children('tbody')
            .children( 'tr' + ( onlyVisible ? ':visible' : '' ) )
            .children(':nth-child(' + ( checkboxColumn + 1 ) + ')')
            .find('input')
            .prop('checked', isChecked)
            .trigger('update');
    });
});

请确保修改 checkboxColumn & onlyVisible 所需的变量。

Make sure to modify the checkboxColumn & onlyVisible variables as desired.

更新：发生错误在刚刚修复的解析器代码中，当前仅在master分支中可用（在我的答案中链接）。否则，您可以输入未选中或选中的 （带引号的精确匹配）来过滤复选框。

Update: There was an error in the parser code that was just fixed, it is currently available in the master branch only (linked in my answer). Otherwise you could just enter unchecked or checked" (checked with a quote for an exact match) to filter the checkboxes.

这些过滤器名称（复选框状态）由 group_checkbox 选项，我刚刚将其添加到答案中。

These filter names (checkbox states) are set by the group_checkbox option, which I just added to my answer.

这篇关于使用tablesorter自定义解析器仅用于使用复选框过滤-需要工作示例的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！