Modal Popup from code behind

I'm having issues trying to load a Modal Popup from a OnClick event from an Image Button. This code goes through and actually runs the sub from the code behind file, but when the page actually finishes loading the modal popup does not show up, it basically just refreshes my page. Can anyone tell me what I'm doing wrong? I'm needing this to work because eventually I'm going to be putting this into a repeater for a bunch of image thumbnails, on click of a particular thumbnail it will load a modal popup with a larger image and some text information.

In my actual file (code below is in a test page without the repeater information), I have the same code but add in my repeater code around it, but on button click it won't even fire the sub from code behind, it simply does a page refresh and thats it.

If I can get this test page to work, then maybe the other will fall into place too.

Frontend Code:
1 <asp:scriptmanager runat="server"></asp:scriptmanager>
2
3 <asp:ImageButton runat="server" ID="test" OnClick="myRun" ImageUrl="/my.jpg" />

4 <asp:Button ID="btnShowPreview" Visible="False" runat="server" Text="Button" />
5
6 <%--Designs--%>
7 <asp:Panel ID="pnlPreview" CssClass="popupModal" Style="display: none;" runat="server" Width="600px">
8 This is the panel.
9 </asp:Panel>

Backend Code: 
1Sub myRun(ByVal SourceAs Object,ByVal ArgsAs ImageClickEventArgs)2Dim modPreviewAs New AjaxControlToolkit.ModalPopupExtender34 modPreview.ID ="mpePreview"5 modPreview.TargetControlID ="btnShowPreview"6 modPreview.PopupControlID ="pnlPreview"7 modPreview.BackgroundCssClass ="modalBackground"9End Sub
 Hope you can help.
Micah

In your codebehind you are just creating the popup extender, you aren't showing it.
You need to call .Show() when you've created it.

Btw, you don't need to create it in codebehind. Create in your .aspx instead and just call Show() on it.

Good call on that one, I was thinking about it later that night to and couldn't figure out why I was doing it from code behind.

I moved the model popup extender to .aspx page and call the mpePreview.Show() from code behind, it does run through the code still, but never displays the modal still.

Any other suggestions? Do I need to have certain properties set on my modal and scriptmanager that I'm missing?

Thanks for the help

MIcah

Ah ha, kind of figured it out, my hidden button is causing the issue, if I make my button visible it works, if I make it invisible it fails.

So now I just need to figure out how to hide my control and have it still fire correctly.

style="display: none;"

will hide effectively.

<asp:Button runat="server" ... style="display: none;" />

Intellisense won't pick it up but you can put it there.

Ahh, sweet that worked perfectly! I hadn't even thought about that option.

Great, Thank you very much.

Micah

Modal popup with an image loaded from a database

I am having a bit of a problem using a modal popup which loads an image from a database. The image loads fine however the first time each image is loaded the modal popup is stuck at the top of the page with the very top of the modal extending over the top of the page. Once the image is cached and I attempt to view it again everything displays correctly. I'm not sure of the best way to fix this problem. Is there a way to have the popup only load once all of the data within the update panel has completely loaded? Here are a few code snippets so you can get an idea of what I'm doing.

I'm opening the modal when the selected item in the datagrid is changed.

protected void Grid_SelectionChanged(object source, EventArgs e)
 {
dispIMG.ImageUrl ="viewImage.aspx?qIID=" + itemDG.SelectedItem.Cells[1].Text +"&sSide=Front";

 ModalPopupExtender.Show();
 }

Any suggestions as to how I could fix this would be greatly appreciated.

cheers

any thoughts? I've tried using thread.Sleep to get the image to load before it actually opens the modal, but this doesn't seem to work. Once the image is initially loaded just simply scrolling the screen or reloading it makes everything display correctly. Banging my head on my desk for this one.

~David

Modal UpdateProgress

Has anyone already developed one of these?

I've got it to work with just an image being centered in the window but I'd like to use a div or iframe to fade the rest of the page.

a div didn't work in IE and the iframe didn't work at all (either firefox or IE).

I have this and its working for me.

<atlas:UpdateProgressID="UpdateProgress1"runat="server"><ProgressTemplate><tablestyle="position:absolute; width:100%; height:100%; z-index:100; background-color:Transparent;"><tr><tdalign="center"><divstyle="width:300px; height:200px;"class="internal"><br/><br/><br/><br/><br/><br/><imgalt=""src="Images/indicator.gif"/> Processing...</div></td></tr></table></ProgressTemplate></atlas:UpdateProgress>

It works in IE and also in FF.

Hope this helps!

Check this one out:

http://www.codeproject.com/useritems/ModalUpdateProgress.asp

Ricardo, I am using yourUpdateProgress code sample for a modal update progress, it is simple and it works well.

Now I want to know how can I have a 'Cancel' button that just stops the request? You see the 'abortButton' seems to reload the orginal request. How could I create my own button for this?

Cheers,
Peter Meadwww.petermeadit.net

Wow,

This is the post that just keeps on giving.

More than a year after you posted this you have solved my problem.

Thanks Ricardo.

Mark