Solved

Create Multiple ModalPopupExtenders Dynamically in C#

Posted on 2009-04-07
2
3,242 Views
Last Modified: 2012-05-06
Hello,

I am trying to create multiple buttons and associated modalpopupextenders, dynamically.  When I create only one button and one modalpopupextender, the popup works.  But when I try to create more than one button and more than one modalpopupextender, the buttons and popups don't work.

I'd very much appreciate any insights.  The code is below and can be tested just by pasting it into a new .aspx file.  To test the creation of multiple versus single sets of buttons and associated modalpopupextenders, just change the value of "numberOfButtonsAndModalPopups" on line 7 below.

 This code will work for " numberOfButtonsAndModalPopups = 1 ", but not for 2, 3, 4 or more...
 
Thanks in advance for any help!
<%@ Page Language="C#" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>

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

<script runat="server">    

    protected void Page_Load(object sender, EventArgs e)

    {

        int numberOfButtonsAndModalPopups = 1;

        

        for (int i = 1; i <= numberOfButtonsAndModalPopups; i++)

        {

            Button btnNew = new Button();
 

            btnNew.ID = "BtnPopup" + i.ToString();
 

            btnNew.Text = "Click Me to Show PopUp Number " + i.ToString();
 

            AjaxControlToolkit.ModalPopupExtender modalPop = new AjaxControlToolkit.ModalPopupExtender();
 

            modalPop.ID = "MpePopUp" + i.ToString();
 

            modalPop.PopupControlID = "ModalPanel";
 

            modalPop.TargetControlID = "BtnPopup" + i.ToString();
 

            modalPop.DropShadow = true;
 

            modalPop.CancelControlID = "btnCancel";
 

            this.Panel1.Controls.Add(modalPop);
 

            this.Panel1.Controls.Add(btnNew);

        }

    }

</script>

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title></title>

</head>

<body>

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

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

        <asp:UpdatePanel ID="UpdatePanel1" runat="server">

        <ContentTemplate>

            <asp:Panel ID="Panel1" runat="server"></asp:Panel>

            <asp:Panel ID="ModalPanel" runat="server" Style="display: none" BackColor="Gray">

                Dynamic ModalPopup!

                <asp:Button ID="btnCancel" runat="server" Text="Close Me" />

            </asp:Panel>

        </ContentTemplate>

        </asp:UpdatePanel>

    </form>

</body>

</html>

Open in new window

0
Comment
Question by:suchandsuch
2 Comments
 
LVL 14

Accepted Solution

by:
GiftsonDJohn earned 500 total points
ID: 24094247
Hi,

The issue is because of the DropShadow behavior. Whenever you enable the DropShadow Property, the dom will initiate the Shadow behavior for the Modal Popup Panel. So when you enable multiple modal popup extenders for the same panel, it gets conflict and it is not able to initiate the shadow effect and will throw the following javascript error.

Sys.InvalidOperationException: Two components with the same id 'ModalPanel$DropShadowBehavior' can't be added to the application.

The above error states that already a behavior for DropShadow is added to the ModalPanel object. So another control can't create a shadow behavior for the same.

If you make DropShadow=false your code will work.
0
 
LVL 1

Author Closing Comment

by:suchandsuch
ID: 31567808
Fantastic - thanks Giftson - I didn't even see the Javascript error.
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

OverviewThis article demonstrates a simple search form using AJAX. The purpose of the article is to demonstrate how to use the same code to render a page and javascript (JQuery) and AJAX to make subsequent calls to refine the results. The princip…
It was really hard time for me to get the understanding of Delegates in C#. I went through many websites and articles but I found them very clumsy. After going through those sites, I noted down the points in a easy way so here I am sharing that unde…
This is used to tweak the memory usage for your computer, it is used for servers more so than workstations but just be careful editing registry settings as it may cause irreversible results. I hold no responsibility for anything you do to the regist…
With the power of JIRA, there's an unlimited number of ways you can customize it, use it and benefit from it. With that in mind, there's bound to be things that I wasn't able to cover in this course. With this summary we'll look at some places to go…

895 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

14 Experts available now in Live!

Get 1:1 Help Now