来自tablesorter的过滤器小部件不起作用 [英] Filter Widget from tablesorter doesn't work

问题描述

我在MVC Razor应用程序中使用Tablesorter(2.22.1)，添加基本过滤器行时遇到问题. 我已经在捆绑包中添加了脚本(js插件).

I'm using Tablesorter (2.22.1) in MVC Razor application and I have a problem with adding basic filter row. I've added scripts (js plugins) in bundle.

bundles.Add(new ScriptBundle("~/bundles/initTableSort").Include(
                "~/Scripts/libs/jquery.tablesorter.js",
                "~/Scripts/libs/jquery.tablesorter.widgets.js",
                "~/Scripts/libs/jquery.tablesorter.combined.js")
);

我还通过jquery将它包含在 _Layout.html 中.我不使用jquery.latest.js，因为在我的项目中有不同的jquery文件(新的)，它们被添加到_Layout中.

I also included it in _Layout.html with jquery. I'm not using jquery.latest.js, because in my project are different jquery files (new) and they are added to the _Layout.

@Scripts.Render("~/bundles/jquery")
...
@Scripts.Render("~/bundles/initTableSort")

我有自己的CSS，并且不使用Tablesorter主题. 我的js函数:

I have my own css and I don't use Tablesorter themes. My js functions:

$(".tablesorter").tablesorter({
    sortReset: true,
    sortRestart: true,
    widthFixed : true,

    textAttribute: 'data-sort',
    widgets: ["filter"],
    widgetOptions: {
        filter_external: '.search',
        filter_defaultFilter: { 1: '~{query}' },
        filter_columnFilters: true,
        filter_placeholder: { search: 'Search...' },
        filter_saveFilters: true,
        filter_reset: '.reset'
    },
    headers: {
        'th.smallChart, th.errorLink': {
            sorter: false,
            filter: false
        },
        'th.errorDifference': {
            sorter: 'data'
        }
    }

});

表中的数据由foreach循环呈现，但是标头和表具有所需的类/标识.我不粘贴表代码，因为它太长了，我认为它的外观没有问题.

Data in table are rendered by foreach loop, but the headers and table has needed classes/ids. I don't paste the table code, because it's too long and I think there's no problem with it how it looks like.

排序之后，重置排序(第三次单击后)，自定义解析器可以正常工作，但是包含小部件过滤器"仅给我一行，以便向每列写入过滤器查询，但它不起作用.我可以写点东西，但此后未过滤表.我不知道为什么检查没有显示任何错误.

After that sorting, reset sorting (after third click), custom parser works fine, but include Widget 'Filter' gives me only row to write a filter query to every column, but it's not working. I could write something, but table is not filtered after that. I don't know why. Inspect doesn't show any error.

请，有人可以帮我解决这个问题，写出我在做错什么吗?

Please, someone could help me with that and write what I'm doing wrong?

编辑1

我什至使用此文档中的数据创建新项目基本过滤器Tablesorter文档，但我仍然遇到相同的问题，因此我必须做错事，但是我不知道在哪里和在哪里.

I even create new project with data from this documentation Basic Filter Tablesorter Documentation and i have still the same issue, so I have to something do wrong, but I don't know what and where.

推荐答案

已解决问题

问题出在.css主题文件中...我没有链接.css蓝色主题文件，因为我使用自己的CSS，但是没有有关您必须将.css主题文件添加到其中的信息.使用过滤.

Problem was in .css theme file... I don't link a .css blue theme file, because I use my own css, but there is no info about that you have to add part of .css theme file to use filtering.

您只需添加

/* rows hidden by filtering (needed for child rows) */
.tablesorter .filtered {
    display: none;
}

/* ajax error row */
.tablesorter .tablesorter-errorRow td {
    text-align: center;
    cursor: pointer;
    background-color: #e6bf99;
}

到您的.css文件，一切正常.

to your .css file and everything goes fine.

这篇关于来自tablesorter的过滤器小部件不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！