AjaxControlToolKit ModalPopupExtender Перетащите оснастку обратно в центр

Я использую ModalPopupExtender из AjaxControlToolKit 4.0 (ASP.NET 4.0), все работает нормально, когда я перетаскиваю ModalPopup, он перетаскивает, но проблема в том, что он привязывается к своему первоначальному расположению (в центре). Тот же код работает над: http://www.asp.net/AjaxLibrary/AjaxControlToolkitSampleSite/ModalPopup/ModalPopup.aspx

У меня есть поиск по этой проблеме, но все решения даются с использованием внешнего кода скрипта Java, но в чем может быть ошибка в следующем коде, когда тот же код работает на странице примера ASP.NET. (Откуда я скопировал тот же код)

Это мой код:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm3.aspx.cs" Inherits="AjaxToolKitTest4.WebForm3" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">
    <title>Hello</title>
    <link href="style.css" rel="stylesheet" />
</head>
<body>
    <form id="form1" runat="server">
        <ajaxToolkit:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"></ajaxToolkit:ToolkitScriptManager>

        <div>
            <%--Start LinkButton to Show Modal Popup Form--%>
            <asp:LinkButton ID="lnkAddForm" Text="Insert" runat="server" OnClick="lnkAddForm_Click"></asp:LinkButton>
            <%--End LinkButton to Show Modal Popup Form--%>

            <%--Start Panel for Modal Popup Form--%>
            <asp:Panel ID="programmaticPopup"  runat="server" CssClass="modalPopup" Style="display: none; width: 350px; padding: 10px;">                
                <asp:Panel runat="Server" ID="programmaticPopupDragHandle" Style="cursor: move; width:100%; background-color: #DDDDDD; border: solid 1px Gray; color: Black; text-align: center;">
                    Title Bar
                </asp:Panel>
                    Content of Modal Form
            </asp:Panel>
            <%--End Panel for Modal Popup Form--%>

            <%-- Start AjaxToolKit ModalPopupExtender for Panel  --%>
            <asp:Button runat="server" ID="hiddenTargetControlForModalPopup" Style="display: none" />
            <ajaxToolkit:ModalPopupExtender 
                ID="programmaticModalPopup"                 
                BehaviorID="programmaticModalPopupBehavior"
                TargetControlID="hiddenTargetControlForModalPopup" 
                PopupControlID="programmaticPopup"
                BackgroundCssClass="modalBackground" 
                DropShadow="false" 
                PopupDragHandleControlID="programmaticPopupDragHandle"
                RepositionMode="RepositionOnWindowScroll"
                runat="server">
            </ajaxToolkit:ModalPopupExtender>
            <%-- End AjaxToolKit ModalPopupExtender for Panel  --%>
        </div>

    </form>
</body>
</html>
Источник

1 ответ

Решение

Модальное всплывающее окно использует body формы для перетаскивания. Если высота тела не установлена ​​должным образом, перетаскивание не будет работать должным образом.

Установите следующие стили CSS, и перетаскивание должно работать.

html, body
{
    margin: 0;
    padding: 0;
    height: 100%;
}
Источник

Установка PopupDragHandleControlID и Drag="true" в большинстве случаев должна быть достаточно хорошей, чтобы перетащить всплывающее окно. Если всплывающее окно откроется, это также может быть браузер. В моем случае тот же код отлично работал в Edge и Chrome, где всплывающее окно можно было перемещать и отбрасывать в нужном месте, но в Internet Explorer всплывающее окно перемещалось при перетаскивании, но возвращалось в исходное положение при отбрасывании.

HTH!

Источник
Другие вопросы по тегам