DataPager在分页后禁用jquery?

时间:2013-09-03 18:44:12

标签: jquery listview webforms datapager

奇怪的问题。找到一些关于模态框的答案,但不是我的问题所特有的,所以我想我会在这里问。此外,当数据包含在listview中时,这些问题正在发生,这很奇怪,但我的DataPager控件不在listview中,它是分页...所以idk ...

我有一个带有复选框的过滤器菜单,用于过滤使用slideToggle()打开和关闭的特定类别,并且在页面刷新或初始加载时,它可以正常工作,但如果您对其下面的结果进行分页,则打开/关闭过滤器按钮不起作用。这是包含listview和datapager的ASP:Panel:

    <asp:Panel ID="PanelMyRecipes" CssClass="wrap" runat="server">
        <asp:LinqDataSource ID="ldsRecipes" runat="server" OnSelecting="ldsRecipes_Selecting">
        </asp:LinqDataSource>
        <asp:ListView ID="lvMyRecipes" runat="server" DataSourceID="ldsRecipes" >
            <EmptyDataTemplate>
                <p class="empty">There are currently no recipes that meet your search criteria.</p>
            </EmptyDataTemplate>
            <LayoutTemplate>
                <table>
                    <tr>
                        <th class="first header-column-1">
                            <ep:ColumnHeader ID="chBrand" runat="server" Text="Brand" Type="SORTABLE" CommandArgument="BrandName" />
                        </th>
                        <th class="header-column-2">
                            <ep:ColumnHeader ID="chRecipeName" runat="server" Text="Recipe Name" Type="SORTABLE" CommandArgument="RecipeName" />
                        </th>
                        <th class="header-column-3">
                            <ep:ColumnHeader ID="chStatus" runat="server" Text="Status" Type="SORTABLE" CommandArgument="CurrentStatusName" />
                        </th>
                        <th class="header-column-4">
                            <ep:ColumnHeader ID="chActions" runat="server" Text="Actions" />
                        </th>
                        <th class="header-column-5">
                            <ep:ColumnHeader ID="chTasks" runat="server" Text="Tasks" />
                        </th>
                        <th class="header-column-6">
                            <ep:ColumnHeader ID="chVersion" runat="server" Text="Version" Type="SORTABLE" CommandArgument="Version" />
                        </th>
                    </tr>
                    <tr runat="server" id="itemPlaceholder" />
                </table>
            </LayoutTemplate>
            <ItemTemplate>
                <asp:PlaceHolder runat="server" ID="phRow">
                    <tr <%# (Container.DataItemIndex % 2 != 0) ? "class=\"alt\"" : "" %>>
                    <td class="column-1">
                        <%# Eval("BrandName") %>
                    </td>
                    <td class="column-2">
                        <a href='<%# Eval("RecipeLink") %>'><%# Eval("RecipeName") %></a>
                    </td>
                    <td class="column-3">
                        <ep:RecipeStatusMenu ID="rsmStatus" runat="server" Text='<%# Eval("CurrentStatusName") %>' ThisRecipeId='<%# Eval("RecipeID") %>' />                            
                    </td>
                    <td class="column-4">
                        <asp:Label ID="lRecipeActionsTarget" runat="server" Text="Choose" SkinID="DropDownExtender" />
                            <asp:Panel ID="pRecipeActionsDropDown" runat="server" SkinID="DropDownExtender">
                            <ep:RecipeActions ID="cRecipeActions" runat="server" RecipeLink='<%# Eval("RecipeLink") %>' ThisRecipeId='<%# Eval("RecipeID") %>'></ep:RecipeActions>
                        </asp:Panel>

                        <asp:DropDownExtender ID="ddeRecipeActions" runat="server" TargetControlID="lRecipeActionsTarget"
                            DropDownControlID="pRecipeActionsDropDown" />
                    </td>
                    <td class="column-5">
                        <asp:LinkButton ID="lbRecipeTasks" runat="server" CssClass="tasks-button" Text="Tasks" CommandArgument='<%# Eval("RecipeID") %>' OnClick="lbRecipeTasks_Click" />
                    </td>
                    <td class="column-6">
                        <%# Eval("Version") %>
                        <asp:Panel ID="pConsumerOperator" runat="server" SkinID="ModalConsumerOperatorResearch">
                            <h3><asp:Label ID="Label3" runat="server" Text="Consumer/Operator Research" /><asp:HyperLink ID="hlClose" runat="server" SkinID="ModalCloseButton" /></h3>
                            <div class="research-content-wrap">
                                <asp:TabContainer ID="tcConsumerOperator" runat="server">
                                    <asp:TabPanel ID="tpComments" runat="server" HeaderText="Comments">
                                        <HeaderTemplate>
                                            <asp:Label ID="Label9" runat="server" Text="Comments" />
                                        </HeaderTemplate>
                                        <ContentTemplate>
                                            <ep:SectionHeader ID="SectionHeader1" runat="server" SectionTitle="Enter Your General Comments" />
                                            <table class="form">
                                                <tr>
                                                    <td>
                                                        <asp:TextBox ID="tbComments" runat="server" TextMode="MultiLine" Width="700" Height="150" />
                                                    </td>
                                                </tr>
                                            </table>
                                            <div class="button-container">
                                                <ep:ActionButton ID="abSubmitComments" runat="server" Text="Submit" Type="ARROW" CommandArgument='<%# Eval("RecipeID") %>' OnClick="abSubmitComments_Click" />
                                            </div>
                                        </ContentTemplate>
                                    </asp:TabPanel>
                                    <asp:TabPanel ID="tpDocuments" runat="server" HeaderText="Documents">
                                        <HeaderTemplate>
                                            <asp:Label ID="Label1" runat="server" SkinID="TabSeparator"><asp:Label ID="Label2" runat="server" Text="Documents" /></asp:Label>
                                        </HeaderTemplate>
                                        <ContentTemplate>
                                            <ep:SectionHeader ID="SectionHeader2" runat="server" SectionTitle="Documents" />
                                            <table class="form">
                                                <tr>
                                                    <td>
                                                        <asp:FileUpload ID="fuConsumerOpDocument" runat="server" />
                                                        <ep:ActionButton ID="abUpload" runat="server" Text="Upload" Type="ADD" CommandArgument='<%# Eval("RecipeID") %>' OnClick="abUpload_Click" />
                                                    </td>
                                                </tr>
                                            </table>
                                            <asp:LinqDataSource ID="ldsDocuments" runat="server" ContextTypeName="EpicPepper.Data.DataContext" TableName="RecipeDocuments" 
                                            Where="DocumentTypeID == 4 && RecipeID == @RecipeID && DisplayName != String.Empty">
                                                <WhereParameters><asp:ControlParameter ControlID="abUpload" PropertyName="CommandArgument" Name="RecipeID" DbType="Int32" /></WhereParameters>
                                            </asp:LinqDataSource>
                                            <asp:ListView ID="lvDocuments" runat="server">
                                                <LayoutTemplate>
                                                    <table class="listings">
                                                        <tr runat="server" id="itemPlaceholder" />
                                                    </table>
                                                </LayoutTemplate>
                                                <ItemTemplate>
                                                    <tr <%# (Container.DataItemIndex == 0) ? "class=\"first\"" : "" %>>
                                                        <td>
                                                            <asp:HyperLink ID="hlDocument" runat="server" Text='<%# Eval("DisplayName") %>' NavigateUrl='<%# EpicPepper.ContentHandler.Content.GetDocumentUrl((Guid)Eval("Guid")) %>' Target="_blank" />
                                                        </td>
                                                    </tr>
                                                </ItemTemplate>
                                            </asp:ListView>
                                        </ContentTemplate>
                                    </asp:TabPanel>
                                </asp:TabContainer>
                            </div>
                        </asp:Panel>
                        <asp:ModalPopupExtender ID="mpeConsumerOperator" runat="server" 
                                                TargetControlID="btnHidden" 
                                                PopupControlID="pConsumerOperator"
                                                CancelControlID="hlClose" />
                        <asp:Button runat="server" ID="btnHidden" style="display:none" />
                    </td>
                </tr>
                </asp:PlaceHolder>
            </ItemTemplate>
        </asp:ListView>
        <div class="pager">
            <asp:DataPager ID="dpRecipes" runat="server" PageSize="10" PagedControlID="lvMyRecipes" Visible="false">
                <Fields>
                    <asp:NextPreviousPagerField ButtonType="Link" ShowFirstPageButton="true" ShowLastPageButton="false" ShowPreviousPageButton="false" ShowNextPageButton="false" ButtonCssClass="button previous first" FirstPageText="First" />
                    <asp:NextPreviousPagerField ButtonType="Link" ButtonCssClass="button previous" PreviousPageText="Previous" ShowNextPageButton="false" />
                    <asp:NumericPagerField ButtonType="Link" ButtonCount="3" />
                    <asp:NextPreviousPagerField ButtonType="Link" ButtonCssClass="button next" NextPageText="Next" ShowPreviousPageButton="false" />
                    <asp:NextPreviousPagerField ButtonType="Link" ShowFirstPageButton="false" ShowLastPageButton="true" ShowPreviousPageButton="false" ShowNextPageButton="false" ButtonCssClass="button next last" LastPageText="Last" />
                </Fields>
            </asp:DataPager>
        </div>
        <div class="spacer"></div>
    </asp:Panel>

那么在分页上打破的javascript是在main.js文件中,看起来像这样:

$(function () {
            $(".filter-icon").click(function () {
                $(".status-panel").slideToggle();
            });

            $(".filter-text").click(function () {
                $(".status-panel").slideToggle();
            });

            $("ul.toolsMenu li:nth-child(2n + 0)").addClass("lighterDarkGrey");

            $("#dashboard #main table tr:even td:nth-child(1n)").addClass("alt-column-1");
            $("#dashboard #main table tr:even td:nth-child(2n)").addClass("alt-column-2");
            $("#dashboard #main table tr:even td:nth-child(3n)").addClass("alt-column-3");
            $("#dashboard #main table tr:even td:nth-child(4n)").addClass("alt-column-4");
            $("#dashboard #main table tr:even td:nth-child(5n)").addClass("alt-column-5");
            $("#dashboard #main table tr:even td:nth-child(6n)").addClass("alt-column-6");
        });

1 个答案:

答案 0 :(得分:0)

固定!

作为参考,我使用的答案在这里: Jquery code doesn't work after paging?

在我的情况下,以下工作:

$(document).ready(function () {
    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(filterFix);
    filterFix();
});

function filterFix() {
    $(".filter-icon").click(function () {
        $(".status-panel").slideToggle();
    });

    $(".filter-text").click(function () {
        $(".status-panel").slideToggle();
    });

    $("ul.toolsMenu li:nth-child(2n + 0)").addClass("lighterDarkGrey");

    $("#dashboard #main table tr:even td:nth-child(1n)").addClass("alt-column-1");
    $("#dashboard #main table tr:even td:nth-child(2n)").addClass("alt-column-2");
    $("#dashboard #main table tr:even td:nth-child(3n)").addClass("alt-column-3");
    $("#dashboard #main table tr:even td:nth-child(4n)").addClass("alt-column-4");
    $("#dashboard #main table tr:even td:nth-child(5n)").addClass("alt-column-5");
    $("#dashboard #main table tr:even td:nth-child(6n)").addClass("alt-column-6");
};

这是重要的部分:

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(filterFix);

您显然可以更改函数名称和内容,只需确保将函数传递给add_endRequest()方法即可。

全部谢谢!