Wednesday, March 28, 2012

Modal popup dynamic content & on mouseclick cancel

Hi

Problem 1:

I am using a ajax modal popup and i wish to have several different ones on my site, for a picture gallery. From what I have understood i need to have a targetcontrolID and am therefor having a dummy button as the targetcontrolID. And then from codebehind i use .Show() on the modal popup to get it showing with dynamic content. However when I use this setup with code behind my button causes a postback that reloads the page, not a very nice result. any suggestions?

Problem 2:


When i get the modal popup up and running I get the cancel button working nice with the cancelcontrolID but i also wish to be able to close the modal popup by just clicking anywhere on the screen. Any suggestions?

/cheers

marcus

Problem 1:

You need to wrap your button in an updatepanel to get an ajax postback rather than a complete page reload. You could also use the Dynamic* properties of the modalpopup to use a web service method to dynamically load the modalpopup content.

Problem 2:

You could try hooking up an onclick handler to the background div that gets created by the modalpopup for the greyed out effect, which you can get access to using $find('ModalPopupBehaviorID')._backgroundElement. I have never tried this so not sure if it will work. Personally, I don't like the behaviour that you are proposing and would leave the modalpopup with just a close button.

Jason


Problem 1: I have now used a updatepanel and it works. there are some glitches though, i now have in my

<contentTemplate>

<%

if i >1 then

modalPopupExtender.Show()

endIf

%>

</contentTemplate>

and I also add 1 to i using viewstate... because otherwise i get the modalpopup the first time the updatepanel loads. is there a nicer way of solving this?

And also i would like the Trigger to be dynamic, since I have 3 different buttons that I all wish to trigger and update the same updatePanel, right now I have 3 different updatePanel that all does the same thing.

Problem 2: Solved it by letting the image that shows be the ancel button and the background just background. thought this worked all right so i havent tried your idea with the div


I wouldn't recommend doing any inline scripting...use code behind instead. I am not sure why you are using this method of incrementing i to show the modalpopup...can't you just make this call to the Show() method in the event handler of the control that fired the postback, e.g. button or link click?

You can update any updatepanel on the page at any time during the postback by calling YourUpdatePanel.Update(). This gives you full control over which parts of the page get updated even if the control that fired the ajax postback lives in a completely different updatepanel. I tend to use this coding method rather than hooking up triggers to the updatepanels.

No comments:

Post a Comment