ModalPopupExtender Example

CSS
Let's make nice see thru background:

.modalBackground

{

  background-color:#CCCCFF;

  filter:alpha(opacity=40);

  opacity:0.5;

}

 

 Position should be -1000px, so during loading you not gonna see popup initialization.

 

.ModalWindow

{

  border: solid1px#c0c0c0;

  background:#f0f0f0;

  padding: 0px10px10px10px;

  position:absolute;

  top:-1000px;

}

 

 ASPX

<ajaxToolkit:ModalPopupExtenderID="ModalPopupExtender1"runat="server"

TargetControlID="lnkPopup"

PopupControlID="panEdit"

BackgroundCssClass="modalBackground"

CancelControlID="btnCancel"

PopupDragHandleControlID="panEdit">

</ajaxToolkit:ModalPopupExtender>

 

<asp:PanelID="panEdit"runat="server"Height="180px"Width="400px"CssClass="ModalWindow">

        <h1>Edit/h1>

        <table width="100%">

            <tr>

                <td class="formtext" style="height: 23px; width: 150px;" align="left">

                    Fields1:

                </td>

                <td>

                    <asp:TextBox ID="txtFields1" runat="server"></asp:TextBox>

                </td>

            </tr>           

       </table>

       <br />

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

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

</asp:Panel>


<a id="lnkPopup" runat="server">Show Popup</a>


Monday, March 17, 2008 | Comments (12) | Add Comment

Comments

Gravatar

Re:ModalPopupExtender Example

ya its working in mozzila bt its useless for the IE 6.0 can u tell me how i set the position center of modalpopup in IE 6.0
thanks.

11/21/2008 12:53:17 AM | by manish nagar
Gravatar

It should work in IE 6.0 as well. You probably have modalpopup panel in some kind of div container, which has style position equal to absolute or relative.

Gravatar

Re:ModalPopupExtender Example

Thanks.

8/20/2009 1:43:22 AM | by BP
Gravatar

Re:ModalPopupExtender Example

Muito bom mesmo eu sou do Brasil e estava procurando um exemplo destes me esclareceu tudo que precisava. Very Good

Best Regards

8/28/2009 12:22:48 PM | by Rodrigo
Gravatar

I glad that I can help.

Gravatar

Re:ModalPopupExtender Example

it good

10/6/2009 6:09:05 AM | by bodhi
Gravatar

Re:ModalPopupExtender Example

Really very nice ... because you didnt explained in words but showed in ur code. thank u very much.

Suggestion : Create one blog and give tutorial, even u can get a little money. bcause it is such good

10/15/2009 11:33:27 PM | by om
Gravatar

Re:ModalPopupExtender Example

Nice, up and running :)

That's the beauty of the internet, information is everywhere, thank you

Vanclei Matheus - Brazil

10/28/2009 6:26:23 AM | by Vanclei
Gravatar

Re:ModalPopupExtender Example

Useless code, what the TargetControlID="lnkPopup" was not included? How is anyone suppose to know what is that?

1/10/2010 8:56:43 PM | by Joe
Gravatar

You are right. I added missing code. Thank you for noticing.

Gravatar

Re:ModalPopupExtender Example

i want to know abourt behaviourid about popup exterdor

3/12/2010 10:48:44 PM | by bhimji mendaparara
Gravatar

Behaviorid is a name of javascript variable for popup. Using this variable you can access corresponding javascript object.

Gravatar

Re:ModalPopupExtender Example

Ya its nice budyy.. Its working fine. Thanks

4/29/2010 10:33:17 PM | by Hemant Ghiya
Gravatar

Re:ModalPopupExtender Example

thanx for the sample.
but i fail to try it.
can you give the complete code or the file

6/17/2010 1:47:55 AM | by mbanx
Gravatar

Re:ModalPopupExtender Example

i am using modal pop up extender but its showing j script error..do solve it.

6/24/2010 12:53:39 AM | by priyanka
Gravatar

What kind of error? Get Firefox and Firebug, it would help.

Gravatar

Re:ModalPopupExtender Example

I have a Modalpopupext control out side the repeater control. I have a button in repeater control. I am calling javascript function showmodalpopup() by using OnClientClick event of the button. It's working nice in IE but it's not showing in the Mozilla. Why

If any one knows why, please let me know the answer

6/25/2010 1:29:29 AM | by Madhusudhan
Gravatar

Do you have Firebug installed? Do you see any javascript errors? Make sure that your OnClientClick function return false, so no post back happens.

Do something like this OnClientClick="ShowPopup();return false;"

New Comment

Your Name:
Email (for internal use only):
Subject:
Comment:
 
Code above:

Categories

Recent Tweets

Valid XHTML 1.0 Transitional