Question

电子邮件行是父级。地址是子行。
显示每个搜索过滤器关键字的childRows 我的目的是简单地过滤childRows并仅显示匹配的childRows和Parent Rows作为输出有人可以帮助我找出问题所在。

HTML code：

<div class="form-control divCheckBox">
        <div class="tableFilterLink" data-table="selectedTableFilter">
            <i class="icon-filter"></i>
            <a>Show Filters</a>
        </div>
        <table id="selectedTableFilter" class="table table-bordered table-striped">
            <thead>
            <tr>
                <th>Selected Email</th>
            </tr>
            </thead>
            <tbody>
            <tr>
                <td>dffbach@yahoo.com</td>
            </tr>
            <tr>
                <td>kjjdoe@hotmail.com</td>
            </tr>
            <tr class="tablesorter-childRow">
              <td colspan="4">
                <div class="bold">Shipping Address</div>
                <div>2255 254th Avenue Se<br>Albany, Oregon 97321</div>
              </td>
            </tr>
            <tr>
                <td>pootconway@earthlink.net</td>
            </tr>
             <tr class="tablesorter-childRow">
              <td colspan="4">
                <div class="bold">Shipping Address</div>
                <div>99700 Bell Road<br>Auburn, California 95603</div>
              </td>
            </tr>
            </tbody>
        </table>
    </div>

使用Javascript：

$("#selectedTableFilter").tablesorter({
    debug: true,
    headerTemplate: "{content}<b></b>",
    cssChildRow : "tablesorter-childRow",
    widgets: ["zebra","filter"],
    sortInitialOrder: "asc",
    sortList: [[0,0]],
    sortRestart: true,
    widgetOptions: {
        filter_hideFilters: true,
        zebra : ['normal-row', 'alt-row' ],
        filter_childRows: true,
        filter_cssFilter  : 'tablesorter-filter',
        filter_startsWith: false,
        filter_ignoreCase : true,
        filter_childWithSibs: false,
    },
    widthFixed: true
});

Answer 1

谢谢@Mottie

Github Issue link

如果您对tablesorter使用自定义主题，请确保包含以下定义：

.tablesorter-filter {
  display: none;
}

<强> JSFIDDLE

Tablesorter Child Row始终显示每个搜索过滤器

1 个答案: