Wednesday, March 28, 2012

HOW do I popup the model popup programmatically?

It's tried to a control click by default.
Does the model popup allow for programmatic viewing?

Thanks!

I really need this!

You can use a hidden button as the targetcontrolid of the modalpopup and have your button postback as normal. You can then call Show() from codebehind or show() from JS to show the modalpopup.


Someone posted this a while back. Another option would be to call the click method of the button you used for the targetcontrolid.

Show and Hide ModalPopupExtender from JavaScript

1) Assign a BehaviourID to the ModalPopupExtender using the BehaviourID attribute.

BehaviorID ="ModalBehaviour"
.ExternalClass .EC_csharpcode, .ExternalClass .EC_csharpcode pre{font-size:small;color:black;font-family:consolas, "Courier New", courier, monospace;background-color:#ffffff;}.ExternalClass .EC_csharpcode pre{;}.ExternalClass .EC_csharpcode .rem{color:#008000;}.ExternalClass .EC_csharpcode .kwrd{color:#0000ff;}.ExternalClass .EC_csharpcode .str{color:#006080;}.ExternalClass .EC_csharpcode .op{color:#0000c0;}.ExternalClass .EC_csharpcode .preproc{color:#cc6633;}.ExternalClass .EC_csharpcode .asp{background-color:#ffff00;}.ExternalClass .EC_csharpcode .html{color:#800000;}.ExternalClass .EC_csharpcode .attr{color:#ff0000;}.ExternalClass .EC_csharpcode .alt{background-color:#f4f4f4;width:100%;}.ExternalClass .EC_csharpcode .lnum{color:#606060;}.ExternalClass .EC_csharpcode, .ExternalClass .EC_csharpcode pre{font-size:small;color:black;font-family:consolas, "Courier New", courier, monospace;background-color:#ffffff;}.ExternalClass .EC_csharpcode pre{;}.ExternalClass .EC_csharpcode .rem{color:#008000;}.ExternalClass .EC_csharpcode .kwrd{color:#0000ff;}.ExternalClass .EC_csharpcode .str{color:#006080;}.ExternalClass .EC_csharpcode .op{color:#0000c0;}.ExternalClass .EC_csharpcode .preproc{color:#cc6633;}.ExternalClass .EC_csharpcode .asp{background-color:#ffff00;}.ExternalClass .EC_csharpcode .html{color:#800000;}.ExternalClass .EC_csharpcode .attr{color:#ff0000;}.ExternalClass .EC_csharpcode .alt{background-color:#f4f4f4;width:100%;}.ExternalClass .EC_csharpcode .lnum{color:#606060;}

2) Use the $find method to get a handle to the Modal Popup Behaviour .

$find ("ModalBehaviour").
.ExternalClass .EC_csharpcode, .ExternalClass .EC_csharpcode pre{font-size:small;color:black;font-family:consolas, "Courier New", courier, monospace;background-color:#ffffff;}.ExternalClass .EC_csharpcode pre{;}.ExternalClass .EC_csharpcode .rem{color:#008000;}.ExternalClass .EC_csharpcode .kwrd{color:#0000ff;}.ExternalClass .EC_csharpcode .str{color:#006080;}.ExternalClass .EC_csharpcode .op{color:#0000c0;}.ExternalClass .EC_csharpcode .preproc{color:#cc6633;}.ExternalClass .EC_csharpcode .asp{background-color:#ffff00;}.ExternalClass .EC_csharpcode .html{color:#800000;}.ExternalClass .EC_csharpcode .attr{color:#ff0000;}.ExternalClass .EC_csharpcode .alt{background-color:#f4f4f4;width:100%;}.ExternalClass .EC_csharpcode .lnum{color:#606060;}.ExternalClass .EC_csharpcode, .ExternalClass .EC_csharpcode pre{font-size:small;color:black;font-family:consolas, "Courier New", courier, monospace;background-color:#ffffff;}.ExternalClass .EC_csharpcode pre{;}.ExternalClass .EC_csharpcode .rem{color:#008000;}.ExternalClass .EC_csharpcode .kwrd{color:#0000ff;}.ExternalClass .EC_csharpcode .str{color:#006080;}.ExternalClass .EC_csharpcode .op{color:#0000c0;}.ExternalClass .EC_csharpcode .preproc{color:#cc6633;}.ExternalClass .EC_csharpcode .asp{background-color:#ffff00;}.ExternalClass .EC_csharpcode .html{color:#800000;}.ExternalClass .EC_csharpcode .attr{color:#ff0000;}.ExternalClass .EC_csharpcode .alt{background-color:#f4f4f4;width:100%;}.ExternalClass .EC_csharpcode .lnum{color:#606060;}

3) Call your hide and show methods on the acquired handle.

4) The Javascript would look like this.

<script language="javascript">function ShowModalPopup() { $find("ModalBehaviour").show(); }function HideModalPopup() { $find("ModalBehaviour").hide(); }</script>


Thanks.

I found what I needed:

ModalPopupExtender1.Show();


Hi ,

That would be meBig Smile.

Here is the link to the original Post.

http://blogs.msdn.com/phaniraj/archive/2007/02/20/show-and-hide-modalpopupextender-from-javascript.aspx

Hope this helps.


Hello,

I have a new problem.
How can I stop the modal popup from disappearing when a postback occurs.

For example, if I have a button on the modal "form", a click makes it dissappear.

Help!

Thanks!


The modal popup will disappear if the entire panel is wrapped in an updatepanel. You can move the update panel inside the panel tags or call Show() in server side code to keep it visible.

No comments:

Post a Comment