从表(JS)中删除过滤器

时间:2017-12-11 11:19:30

标签: javascript jquery html

我有过滤表

这是表格

<table id="table" class="table" style="width: 100%">

            <tbody id="findings" style="overflow-y: scroll;">
            @foreach (var item in Model)
            {
                <tr>
                    <td class="point">
                        @(rowNo += 1)
                    </td>
                    <td style="display: none" id="patientId" class="title">
                        @Html.DisplayFor(modelItem => item.Patient_id)
                    </td>
                    <td class="title">
                        @Html.DisplayFor(modelItem => item.Start_appointment)
                    </td>
                    <td id="nameVal" class="title">
                        @Html.DisplayFor(modelItem => item.Patient.Name)
                    </td>
                    <td id="nameVal" class="title">
                        @Html.DisplayFor(modelItem => item.Doctor.First_Name)
                    </td>
                    <td class="title">
                        <img src="@item.Calculation.CalculationStatus"/>
                    </td>
                    <td class="title" style="display:none" id ="status">
                        @Html.DisplayFor(modelItem => item.Calculation.Status)
                    </td>
                    <td class="title">
                        <img style="width: 30px; height: 30px;" class="masters_data" src="~/images/icons8-Document-30.png"/>
                    </td>
                </tr>
            }
            </tbody>
        </table>

我想通过按下按钮来过滤它。

所以我写了这个方法

以下是方法代码:

 $('.not-filled-button').click(function() {
    statusFilter(this);
});


function statusFilter(element) {
    var $rows = $('#findings tr');
    var status = $.trim($(element).get(0).id).toLowerCase();
    $rows.show().filter(function() {
        var text = $(this).text().replace(/\s+/g, ' ').toLowerCase();
        return !~text.indexOf(status);
    }).hide();
}

过滤效果很好。

但我希望清除所有过滤器,并在过滤前显示所有数据。

如何通过js删除过滤器?

感谢您的帮助。

1 个答案:

答案 0 :(得分:0)

function showAll(){
    var $rows = $('#findings tr');
  $rows.show();
}

想要删除过滤器时调用此功能。

EG。 <button id="clearFilter">Clear filter</button>

将此添加到HTML:

<button id="clearFilter">Clear filter</button>

这是JS:

function showAll(){
    var $rows = $('#findings tr');
  $rows.show();
}

var buttonClearFilter = $('#clearFilter);
buttonClearFilter.click(showaAll);