2

WebアプリケーションでAjaxControlToolkitのModalPopupExtenderを使用しています。Dragプロパティをtrueに設定しましたが、ポップアップパネルをドラッグして新しい位置にドロップすると、すぐに元の位置に戻ります。効果を取得したいサンプルのように、別の位置にドラッグ/ドロップできます。ページの例ではどのように..

http://www.asp.net/ajaxLibrary/AjaxControlToolkitSampleSite/ModalPopup/ModalPopup.aspx

ここに私のコード：

<form id="form1" runat="server">

    <asp:scriptmanager id="ScriptManager1" runat="server">
       </asp:scriptmanager> 

       <asp:button id="btnAddNew" runat="server" text="New Expanse" />

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

<div class="popupConfirmation" id="Panel1" style="display: none">

        <iframe id="frameeditexpanse" src="Benutzer.aspx" frameborder="1" height="500px" width="520px">
        </iframe>

        <div class="popup_Buttons" style="display: none">
            <input id="btnOkay" type="button" value="Speichern" />
            <input id="btnCancel" type="button" value="Abbrechen" />
        </div>

</div>

PS：ダイアログが開いている場合は、バックグラウンドのテキストボックスに入力したいです。

アップデート：

..。

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


   <div id="PopupHeader" style="display: none; background-color:Blue">
        Benutzerinformationen
   </div>

   <div class="popupConfirmation" id="Panel1" style="display: none">

    <iframe id="frameeditexpanse" src="ZweiteSeite.aspx" frameborder="1">
    </iframe>

    <div class="popup_Buttons" style="display: none">
        <input id="btnOkay" type="button" value="Speichern" />
        <input id="btnCancel" type="button" value="Abbrechen" />
    </div>

..。

4

2 に答える 2

8

これを試して

<style type="text/css">
  .modalPopup
  {
    background-color: #ffffdd;
    border-width: 3px;
    border-style: solid;
    border-color: Gray;
    padding: 3px;
    width: 100%;
  }
</style>

<asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <asp:Button ID="btnAddNew" runat="server" Text="New Expanse" />
    <cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server" CancelControlID="btnCancel"
        OkControlID="btnOkay" TargetControlID="btnAddNew" PopupControlID="Panel1" PopupDragHandleControlID="PopupHeader"
        Drag="true" BackgroundCssClass="ModalPopupBG">
    </cc1:ModalPopupExtender>
    <div class="popupConfirmation" id="Panel1" style="display: none">
        <asp:Panel runat="server" ID="PopupHeader" CssClass="modalPopup">
            **************** Drag me ****************
        </asp:Panel>
        <iframe id="frameeditexpanse" src="http://www.bing.com" frameborder="1" height="500px"
            width="520px"></iframe>
        <div class="popup_Buttons" style="display: none">
            <input id="btnOkay" type="button" value="Speichern" />
            <input id="btnCancel" type="button" value="Abbrechen" />
        </div>
</div>
于 2012-08-14T08:11:15.307 に答える
0

@yogiによって投稿された回答は完全に機能します。問題がある場合は、EdgeとChromeでスムーズに機能するため、別のブラウザで同じページを参照してみてください。ただし、Internet Explorerには、ポップアップの移動とドラッグアンドドロップに問題があります。

于 2020-05-21T20:46:30.713 に答える