0

パネルをポップアップして ajax モーダル ポップアップに表示する必要があります。しかし、どういうわけか、想定どおりに機能していません。ボタンをクリックして modalpopupextender を呼び出す必要がありますが、ページをロードするとすべてが表示され、ボタンをクリックしても何も起こりません。

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit"TagPrefix="ajaxToolkit" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<style type="text/css">
.modalBackground
{
    background-color: Gray;
    filter: alpha(opacity=70);
    opacity: 0.7;
}
.modalPopup
{
    background-color: #ffffdd;
    border-width: 3px;
    border-style: solid;
    border-color: Gray;
    padding: 3px;
    width: 250px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
     <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</div>

  <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>

<asp:Button ID="Button1" runat="server" Text="Button" />


<ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender1" runat="server"
    BackgroundCssClass="modalBackground"
    PopupControlID="Panel1"
    TargetControlID="Button1"
    CancelControlID="BtnClose"
    OkControlID="BtnOK"
    ></ajaxToolkit:ModalPopupExtender>        
    <asp:Panel ID="Panel1" runat="server" CssClass="modalPopup">
    <h2>this is modal popup</h2>
    <p> update data ?</p><br />
    <asp:Button ID="BtnClose" runat="server" Text="Cancel" />
    <asp:Button ID="BtnOK" runat="server" Text="OK" />
</asp:Panel>
<br />
</form>
</body>
</html>

これはそれがどのように見えるかです：

ここに画像の説明を入力

4

3 に答える 3

1

ajaxToolkit がうまく動作しません (すでに多くの問題を抱えていました)。prettyPhoto を使用してみてください:

http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/

于 2013-08-04T14:36:46.010 に答える
1

css を変更します。

 <style type="text/css">
    .modalBackground
    {
        background-color: Gray;
        filter: alpha(opacity=70);
        opacity: 0.7;
    }
    .modalPopup
    {
        background-color: #ffffdd;
        border-width: 3px;
        border-style: solid;
        border-color: Gray;
        padding: 3px;
        width: 250px;
    }
</style>

ModalPopupExtender コントロール プロパティ BackgroundCssClass="modalBackground" を設定します。そして、パネル CssClass="modalPopup".

于 2013-08-04T12:14:02.267 に答える
-2

以下をページに追加します。

<ajaxToolkit:ToolScriptManager>
etc.

次に、パネルを UpdatePanel 内に配置します

于 2014-06-10T02:53:27.080 に答える