似乎JQuery和AjaxToolkit不能一起工作

时间:2011-08-21 06:29:31

标签: jquery ajaxcontroltoolkit

我使用JQuery创建了一个很好的工具提示框,我使用了一些在所有浏览器中都能很好地运行的插件。但是当我将我的组件放在更新面板中时,问题就开始了。我通过显示一些代码来解释这个问题:

 <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                            <ContentTemplate>
                                <asp:UpdateProgress ID="UpdateProgress0" runat="server">
                                    <ProgressTemplate>
                                        <div style="width: 100%;">
                                            <p>
                                                Please Wait, It is loading...
                                            </p>
                                        </div>
                                    </ProgressTemplate>
                                </asp:UpdateProgress>
                                <table class="style1">
                                    <tr>
                                        <td align="center">
                                            <asp:Button ID="btnUpBestSale" runat="server" OnClick="btnUpBestSale_Click" Text="▲" />
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <div id="demo">
                                                <uc6:GroupLoader ID="GroupLoader1" runat="server" GroupCode="37" ItemCount="5" ItemCountSkipness="0"
                                                    RepeatedColumns="1" TypeID="Vertical" />
                                            </div>
                                            <script>
                                                $("#demo img[title]").tooltip({ offset: [30, 25] });
                                            </script>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td align="center">
                                            <asp:Button ID="btnDownBestSale" runat="server" OnClick="btnDownBestSale_Click" Text="▼" />
                                        </td>
                                    </tr>
                                </table>
                            </ContentTemplate>
                        </asp:UpdatePanel>

单击我的grouploader组件中的按钮和行数据绑定事件时,必须使用“更新”面板。

它第一次工作但是在点击更新面板内的按钮之后,jquery事件再也没有上升。

我如何解决这个问题?

2 个答案:

答案 0 :(得分:3)

请尝试使用此代码。它将确保在更新UpdatePanel中的所有内容后执行脚本。 (参考:http://msdn.microsoft.com/en-us/library/bb383810.aspx

<script>
      var prm = Sys.WebForms.PageRequestManager.getInstance();
      prm.add_endRequest(function() {
          $("#demo img[title]").tooltip({ offset: [30, 25] });
      });
</script>

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
                            <ContentTemplate>
                                <asp:UpdateProgress ID="UpdateProgress0" runat="server">
                                    <ProgressTemplate>
                                        <div style="width: 100%;">
                                            <p>
                                                Please Wait, It is loading...
                                            </p>
                                        </div>
                                    </ProgressTemplate>
                                </asp:UpdateProgress>
                                <table class="style1">
                                    <tr>
                                        <td align="center">
                                            <asp:Button ID="btnUpBestSale" runat="server" OnClick="btnUpBestSale_Click" Text="▲" />
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <div id="demo">
                                                <uc6:GroupLoader ID="GroupLoader1" runat="server" GroupCode="37" ItemCount="5" ItemCountSkipness="0"
                                                    RepeatedColumns="1" TypeID="Vertical" />
                                            </div>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td align="center">
                                            <asp:Button ID="btnDownBestSale" runat="server" OnClick="btnDownBestSale_Click" Text="▼" />
                                        </td>
                                    </tr>
                                </table>
                            </ContentTemplate>
                        </asp:UpdatePanel>

答案 1 :(得分:0)

jquery在更新面板的异步回发后无法工作。所以你必须使用endrequesthandler, 这是怎么做的。 http://codethatworkedforme.blogspot.com/2011/08/having-issues-with-update-panel.html