表上的jquery过滤器第一次工作,但之后隐藏所有行

时间:2015-02-11 22:27:53

标签: javascript jquery html jquery-filter

我创建了一个过滤器,只显示包含td的行,其中包含从下拉列表中选择的值。过滤器第一次工作正常,但第二次运行它,所有行消失,我无法弄清楚原因。 这是我的过滤器:

$(document).ready(function(){
    $('select[name=selectedName]').change(function() {
        $('tr').filter(function () {
            return $(this).find('td.userName').filter(function () {
                return $(this).text().indexOf($('select[name=selectedName]').val()) == -1;
            }).length;
        }).hide();
    });
});

下拉:

$query = "SELECT user_name FROM users";
$result = mysql_query($query); ?>
<select name="selectedName" id="userSelected">
    <option value="" disabled selected>user name</option>
    <?php while ($line = mysql_fetch_array($result, MYSQL_ASSOC)) { ?>
        <option value="<?php echo $line['user_name'];?>">
            <?php echo $line['user_name'];?>
        </option>
    <?php } ?>
</select>

最后创建表:

    <table class="table table-bordered table-hover" ng-controller="tableCtrl">
        <thead>
        <th>user name</th>
        <th>script name</th>
        <th>cron format<span class="glyphicon glyphicon-question-sign"></span></th>
        <th>schedule last update</th>
        <th>next execution time</th>
        <th>script exec</th>
        </thead>
        <tbody ng-repeat="(user_id,script_id) in data">
            <tr ng-repeat="(script_id, cron_format) in script_id">
                <td class="userName">{{user(user_id)}}</td>
                <td class="scriptName">{{script(script_id)}}</td>
                <td class="cronFormat"><span contenteditable="true" ng-repeat="l in letters(cron_format) track by $index">{{l}}</span></td>
                <td>{{compare(user_id,script_id,cron_format)[0]}}</td> <!--[0] represents scheduler last update-->
                <td>{{compare(user_id,script_id,cron_format)[1]}}</td> <!--[1] represents next execution time-->
                <td>{{compare(user_id,script_id,cron_format)[2]}}</td> <!--[2] represents script_exec-->
            </tr>
        </tbody>
    </table>

知道为什么会这样吗?谢谢你的帮助...

更新

我添加$('tr').show();并且功能正常工作除外,如何在下拉列表中添加值以显示所有表格/取消过滤器?

1 个答案:

答案 0 :(得分:2)

你负责隐藏行,但你永远不会显示它们。这就是为什么你的桌子迟早会让所有行都不可见。