Sys.Application.add_load Problem with Modal popup extender

Question

Hello everyone,

I have the current problem, let's explain the context before :

I have a Modal popup extender who contains a form. There is a feature "Save and Add New", when the user click on this button the data in the form is saved in the database during postback and the page is reloaded.

I want this Modal popup to appear again on the page_load allowing the user to enter new data without clicking again on the button who show this Modal Popup.

I've tried to call it this way first :

ClientScript.RegisterStartupScript(Page.GetType(), "ModalPopup", "ShowModalPopup(""" & Me.formModalButton.ID & """);", True)

but the problem was when the function was called my Modal Popup was not existing yet on the page. Because of that the code was crashing on the

var modal = $find('myModal');

So, I found that other way and it's working almost perfectly.

ClientScript.RegisterStartupScript(Page.GetType(), "ModalPopup", "Sys.Application.add_load(function() {ShowModalPopup(""" & Me.formModalButton.ID & """)};", True)

The modal is showing up on the page load like I want, but the problem is if I click on any other button on my page the Modal Popup is also appearing again.

Example : I have another Modal Popup for deleting data, when I click on the button, both Modal are appearing, which is not cool.

Does anyone have a clue about how to fix that or a better way to do it ?

P.S. I'm not calling to Modal popup server-side because the javascript function exist in the page, so I don't want to create a copy of this function in the RegisterStartupScript.

Thx for your time.

Answer 1

Use the below code snippet

//Declares gloabal variable
ClientScript.RegisterStartupScript(Page.GetType(),"vardeclaration","var reloadModal;",true);

ClientScript.RegisterStartupScript(Page.GetType(), "ModalPopup", "Sys.Application.add_load(

function() 
{
   reloadModal = function() {ShowAddModalPopup(""" & Me.imgAdd.ID & """);};
   Sys.Application.add_init(reloadModal);
}
);", True)

This would allow you to use

function cancelClick()
{
   Sys.application.remove_init(reloadModal);
}

Answer 2

Hi again,

I'll show the current situation :

ClientScript.RegisterStartupScript(Page.GetType(), "ModalPopup", "Sys.Application.add_load(

function() 
{
   var reloadModal = function() {ShowAddModalPopup(""" & Me.imgAdd.ID & """);};
   Sys.Application.add_init(reloadModal);
}
);", True)

This where I am now, the code lines above are written in one line in my code, I ident them to make it more readable.

So, I got what I want, like that the Modal Popup appear again on the page load. The problem remains the same, when I click on another button (without postback) both modal apear.

The famous modal popup who appear on the page_load have a Cancel button, so I tried to remove_init the script on the Cancel button click like that :

        function cancelClick()
{
   Sys.application.remove_init(reloadModal);
}

But, it's prolly not working because the fact that "reloadModal" variable is out of range when I call the function...

I also tried this way

        ClientScript.RegisterStartupScript(Page.GetType(), "ModalPopup", "Sys.Application.add_load(

function() 
{
   var reloadModal = function() {
                                  ShowAddModalPopup(""" & Me.imgAdd.ID & """);
                                  Sys.Application.remove_init(this);
                                 };
   Sys.Application.add_init(reloadModal);
}
);", True)

Thx for helping.

Answer 3

Hello,

Finally I found a workaround for my current problem.

I'm still using the ClientScript.Resgister[...] but this time I also change the OnClientClick Javascript function of my cancel button.

So when the guy select the feature "Save and Add New", when the page reload and the modal Show again if he click on Cancel I do a postback to the server just to reload the page and solve those weird behavior.

I also think, the problem could exist because of the different Update Panel in my code, but I need them to make the Modal Popup Extender working.

Anyway, I discovert that's it's not even working in Opera and Safari, but the Whole thing (Ajax Control toolkit - Modal popup extender).

It's a chance the compagny here don't care about the other and support officially only IE. In my case, I wanna make it works at least in FF and Chrome too.

ClientScript.RegisterStartupScript(Page.GetType(), "ModalPopup", "Sys.Application.add_load(function() {ShowAddModalPopup(""" & Me.imgAdd.ID & """)});", True)
                btnCancel.OnClientClick = "resetDefaultValue();__doPostBack('" & btnCancel.ID & "','onclick')"

So there is the code, also in FF another error appear,

Sys.WebForms.PageRequestManagerServerErrorException: An unknown error occurred while processing the request on the server. The status code returned from the server was: 0

And I found this workarounf for it, it's not the best but I lost enought time with this...

ClientScript.RegisterStartupScript(Page.GetType(), "WorkAroundFF", "Sys.WebForms.PageRequestManager.getInstance().add_endRequest(endRequest); function endRequest(sender, args) { /* Check to see if there's an error on this request.*/ if (args.get_error() != undefined) { $get('Error').style.visibility = ""visible""; /* Let the framework know that the error is handled, so it doesn't throw the JavaScript*/ alert. args.set_errorHandled(true); } }", True)

So thx for your help Ramesh, i'm pretty sure your solution would work if it was not my Update Panels.

Hope that could help someone else.