升级到最新版本的jQuery后,常规的自定义过滤不起作用

时间:2019-08-17 18:45:20

标签: jquery footable

我正在使用最新版本的Footable.js。一切工作都很好,直到我最近将jQuery从2.2.4版本更新到最新版本为止。我遇到的问题与我为自定义基础过滤构建的自定义UI有关。这是下面的代码。

似乎给我带来问题的特定代码段是:

$('#<%= ListViewContainer.ClientID%>.footable-container.list-view table').each(function () {
            tables.push(FooTable.get($(this).footable()));

        });

<script type="text/javascript">    
    jQuery(function ($) {
        var tables = [];
        var handleSearch = function () {
            var searchQuery = $("#<%= SearchTextBox.ClientID%>").val();

            $(tables).each(function () {
                var table = this;
                var filtering = table.use(FooTable.Filtering);
                if (searchQuery === '') {
                    filtering.removeFilter('search');
                } else {
                    filtering.addFilter('search', searchQuery);
                }
                filtering.filter();
            });
        }
        var clearSearch = function () {
            $(tables).each(function () {
                var table = this;
                var filtering = table.use(FooTable.Filtering);
                filtering.removeFilter('search');
                filtering.filter();
            });
        };

        $('#<%= ListViewContainer.ClientID%>.footable-container.list-view table').each(function () {
            tables.push(FooTable.get($(this).footable()));

        });

        $("tr.footable-filtering").hide();

        var searchText = $("#<%= SearchText.ClientID %>");
        var clearSearchText = $("#<%= ClearSearchText.ClientID %>");

        clearSearchText.hide();

        $("#<%= SearchButton.ClientID %>").on("click", function () {
            if ($("#<%= SearchButton.ClientID %>").find(".fooicon").hasClass("fooicon-remove")) {
                $("#<%= SearchTextBox.ClientID %>").val("");
                $("#<%= SearchButton.ClientID %>").find(".fooicon").removeClass("fooicon-remove");
                $("#<%= SearchButton.ClientID %>").find(".fooicon").addClass("fooicon-search");

                clearSearchText.hide();
                searchText.show();

                clearSearch();
            }
        });
        $("#<%= SearchTextBox.ClientID%>").on("keydown", function (e) {
            if ($("#<%= SearchTextBox.ClientID%>").val().length >= 1) {
                clearSearchText.show();
                searchText.hide();
                $("#<%= SearchButton.ClientID %>").find(".fooicon").addClass("fooicon-remove");
            } 
            else {
                $("#<%= SearchButton.ClientID %>").find(".fooicon").removeClass("fooicon-remove");
                $("#<%= SearchButton.ClientID %>").find(".fooicon").addClass("fooicon-search");
                clearSearch();
            }
        });

        $("#<%= SearchTextBox.ClientID%>").on("keypress", function (e) {
            if (e.keyCode === 13) {
                e.preventDefault();
                handleSearch();
            } else {
                if ($("#<%= SearchTextBox.ClientID%>").val() !== "") {

                    $("#<%= SearchButton.ClientID %>").find(".fooicon").addClass("fooicon-remove");
                    setTimeout(function () { handleSearch(); }, 1000);
                }
                else {
                    $("#<%= SearchButton.ClientID %>").find(".fooicon").removeClass("fooicon-remove");
                    $("#<%= SearchButton.ClientID %>").find(".fooicon").addClass("fooicon-search");
                    clearSearch();
                }
            }
        });
        // Change the empty text only on the first page load in the case that there are not any items in the table to begin with.
        var emptyColumn = $('#<%= ListViewContainer.ClientID%>.footable-container.list-view tr.footable-empty td ');
        var emptyText = '<%= Globalizer.GetString("MSG_NO_HANDOUTS_FOR_SET") %>';
        emptyColumn.text(emptyText);
        var findToggles = $('.pi_Handouts #<%= ListViewContainer.ClientID%>.footable-container.list-view .footable-toggle');

        for (var i = 0; i < findToggles.length; i++) {
            //Setting custom event handler for the styling to make this work on Fire Fox. 
            $(findToggles[i]).each(function () {
                var toggleButton = $(this).closest("button");
                var collapsePanel = $($(toggleButton).attr("href"));
                var chevronIcon = $(this);
                    collapsePanel.on("show.bs.collapse", function () {
                        chevronIcon.switchClass('glyphicons-chevron-down', 'glyphicons-chevron-up');
                    });
                    collapsePanel.on("hide.bs.collapse", function () {
                        chevronIcon.switchClass('glyphicons-chevron-up', 'glyphicons-chevron-down');
                    });
            });
        }

        var checkbox = $('#<%= ListViewContainer.ClientID%> .checkbox-visible');
        var togglePlusIcon = $('#<%= ListViewContainer.ClientID%> .fooicon-plus');
        var linkWrapper = $('#<%= ListViewContainer.ClientID%> .title-link-wrapper');

        if (checkbox.length < 1) {
            togglePlusIcon.addClass('float-left');
            linkWrapper.addClass('float-left');
        } else if (checkbox.length >= 1) {
            togglePlusIcon.removeClass('float-left');
            linkWrapper.removeClass('float-left');
        }

        var getHandoutsCheckboxes = $('.handouts-footable input[type=checkbox]');
        var deleteSelectedBtn = $('#<%= DeleteSelectedHandouts.ClientID%>');
        var isCheckedCounter = 0;

        deleteSelectedBtn.attr('onclick', 'event.preventDefault()');
        deleteSelectedBtn.css('opacity', '.5');
        deleteSelectedBtn.attr('aria-label', '<%=Globalizer.GetString("TXT_DELETE_DISABLED") %>');

        getHandoutsCheckboxes.on('change',
            function () {
                if ($(this).is(':checked')) {
                    isCheckedCounter++;

                } else if (!$(this).is(':checked')) {
                    isCheckedCounter--;

                }
                if (isCheckedCounter === 0) {
                    deleteSelectedBtn.attr('onclick', 'event.preventDefault()');
                    deleteSelectedBtn.css('opacity', '.5');
                    deleteSelectedBtn.attr('aria-label', '<%=Globalizer.GetString("TXT_DELETE_DISABLED") %>');
                } else {
                    deleteSelectedBtn.attr('onclick', 'preventDefaultEvent(event, confirm("<%=Globalizer.GetString("MSG_DELETE_CONFIRM") %>"))');
                    deleteSelectedBtn.css('opacity', '1');
                    deleteSelectedBtn.removeAttr('aria-label');
                }
            });

    });
</script>

使用jQuery 2.2.4,$(this)将每个表注册为一个可记录区域。但是升级到最新的jQuery后,$(this)是不确定的。

0 个答案:

没有答案