Question

我在ajaxcontroltoolkit的模态弹出扩展器中使用jQuery的可拖动函数时遇到了困难。如果我在扩展的面板之外使用此代码，它工作正常，但一旦它在面板内，我不能再拖动该项目。我认为这与以下事实有关：面板启动时不是可见的，然后在用户单击按钮时更改（可能该项最初不在DOM中）。有谁知道如何让这两件事情很好地融合在一起？贝娄是我的代码：

    <asp:RoundedCornersExtender ID="RoundedCornersExtender1" runat="server" TargetControlID="Panel1" Radius="20">
    </asp:RoundedCornersExtender>

    <asp:button id="Button1" runat="server" text="Button" CssClass="hidden" />

    <asp:modalpopupextender id="ModalPopupExtender1" runat="server" 
            cancelcontrolid="btnCancel" 
            targetcontrolid="Button1" popupcontrolid="Panel1" 
            popupdraghandlecontrolid="PopupHeader" drag="true" 
            backgroundcssclass="ModalPopupBG">
    </asp:modalpopupextender>

    <asp:panel id="Panel1" runat="server"  class="manageLoopsPanel">  
          <div id= 'someId' class="draggable1 ui-widget-content" style="border:1px solid black;">
               <table>
                   <tr>
                     <td>
                        <asp:Label ID="DOBLabel" runat="server" Text='22' />
                        <asp:Label ID="Label2" runat="server" Text='33' />
                     </td>
                   </tr>
                 </table>
          </div>     
    </asp:panel>

我的jQuery看起来像这样：

           $(function () {
                $(".draggable1").draggable({
                    helper: 'clone',
                    zIndex: '5000',
                    scroll: false,
                    revert: "invalid",
                    appendTo: 'body',
                    drag: function (event, ui) {
                    }
                });

Answer 1

在我看来，使用orangebox弹出窗口。不要使用jquery与ajax更新面板。但如果你坚持，那么请做以下事项当您使用“更新”面板时，它将部分呈现您的页面，因此您必须使用可以回发页面的内容并查看下面的代码

     <asp:UpdatePanel ID="AjaxPanel" runat="server" UpdateMode="Conditional" ClientIDMode="Static">
            <ContentTemplate>
<!-- all your code goes here -->
      </ContentTemplate>
            <Triggers>
                <asp:PostBackTrigger runat="server" ControlID="Button1" />  <!-- that will be the button which will fully postback by clicking on it. -->        
            </Triggers>
        </asp:UpdatePanel>

请告诉我这是否有助于进一步解释阅读此article。

在ajax控件工具包modalpopupextender中使用jquery

1 个答案: