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.
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);
}
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.
Related
I cannot seem to get Chrome to pop up an "alert" page. The alert page has code in it, so it can't really be a DIV or I would just do it that way. It worked for many years, but likely do to a Chrome update it will no longer function. Still works fine in IE11, though.
The following code is used to pop up an "alert" page when there is an alert that is queried from a Database. It has always worked until recently (15 years and running)
CODE:
ClientScript.RegisterStartupScript(GetType(Page), "Alarm", "<script language='javascript'>window.showModalDialog('Alarm.aspx?ID=" & AlarmID & "', null, 'dialogWidth=460px;dialogHeight=310px;status=no;resizable=yes');document.frmA.submit();</script>")
I've tried a few things like windows.open and creating a hidden button on the asp.net page and then using the click event. Nothing works. I do not see a blocked popup in Chrome and I have even went into settings and did the following:
Set Safe Browsing to "No Protection"
Set allow pop-ups and redirects on the server name (http://servername and http://localhost)
As noted, near all browsers quite much have clamped down on popup windows. this makes things more difficult for web developers.
There are two good approaches. one I don't fancy at all is using bootstrap dialogs, but they tend to "sort of work all on their own" kind of deal based on class settings for divs etc. - really hard to debug.
Since near all sites these days include jQuery for your js code, then I quite much hands down recommend you introduce jquery.UI. It has a whole slew of nice things such as date pickers etc. But it also has a rather nice dialog pop option. They just work, and when you code them up? They follow "normal" like code approaches.
it not quite clear if your message/dialog pops after say a button click (and post back), and the at the end of that process, you need/want some dialog message to display. But all in all, I would high recommend jQuery.UI for this dialog/message that you need.
jQuery.UI in most cases expects the content you want to "display/pop" exists in a simple div in the current existing page. However, it also works VERY well if you supply the dialog another existing web page. The only REAL big issue to keep in mind? That dialog page you pop cannot handle multiple post-backs. (so, some buttons, or ONE post back in that dialog is fine - but you ONLY get the ONE post-back.
So, if that page display allows some input, or some interaction and ONLY requires ONE post-back, then jQuery.UI is again great. If that pop page requires several buttons and several post-backs, then you are in for a world of pain and hurt - jQuery.UI dialogs (like most) cannot survive or handle multiple postbacks. Any post-back means the dialog closes (collapses). So in those cases, you have to adopt ajax calls (web methods) if you need/have/want that page to have more then one active post-back button or event.
So, you could have/place a script in even your master page, and little function code stub that your register script can call.
Or, I suppose you could inject the whole script, but the script would look like this:
So, the pop page actualy is SHOVED into a div. So we have a div that "holds" the page.
The jQuery.UI code script then looks like this:
<div id="poppagearea">
</div>
<script>
function showpage() {
var mydiv = $('#poppagearea');
mydiv.dialog({
autoOpen: false, modal: true, title: 'My cool other page', width: '30%',
position: { my: 'top', at: 'top+150' },
buttons: {
'ok': function () {
mydiv.dialog('close');
alert('user click ok');
},
'cancel': function () {
mydiv.dialog('close');
alert('user click cancel');
}
}
});
mydiv.load('Default.aspx');
// Open the dialog
mydiv.dialog('open');
}
So, in above, we loaded "default.aspx" into that dialog and thus displayed it on the page.
So, I would consider jQuery.UI - but it does mean adopting a new js library into your existing project.
The pop page does gray out the full page, and you do get a title bar, and your own ok, cancel button. The above thus looks like this:
So, it does a great job - but as noted, that page can only have one post-back, and it can't be a general working aspx page with lots of buttons and post backs - but it will render and display rather well.
When implementing the "Connect to QuickBooks" button in my web application I found that it pops a new window instead of just being redirected, which is very undesired in the long run of this application. Is there any way to keep the button from popping a new window and just redirect in the same tab? Or would that go against Inuit's Do's and Don'ts (1. Don't modify the appearance or behavior of this button. 2. Don't modify the code that implements this button.)
I'm assuming the command to pop a new window is in Intuit's JavaScript anywhere() function but I didn't know if there was a way to prevent it from popping a new window and just make it use the same tab, without changing their code.
Or, if there really isn't anything would it be possible to close the popped up window automatically and resume control of the previously used tab? I tried to look this solution up but didn't find anything really, or at least nothing that worked for me.
Thanks for any help.
EDIT:
I figured out how to close the the window...now it's just a matter of handling the refreshing the page it goes back to to something. I haven't quite figured out how it works yet but I ended up using:
<script type="text/javascript">
try {
var parentlocation = window.parent.opener.location.hostname;
var currentlocation = window.location.hostname;
if (parentlocation != currentlocation) {
window.location = "/default.aspx";
}
else {
window.opener.location.href = window.opener.location.href;
window.close();
}
}
catch (e) {
window.location = "/default.aspx";
}
</script>
If someone wouldn't mind explaining that code that would be awesome, but nobody has to. I just can't right now so I'll do it later on my own.
I found that it pops a new window instead of just being redirected,
Yep, this is what Intuit wants it to do.
Is there any way to keep the button from popping a new window and just
redirect in the same tab?
Nope.
Trying to do that is a great way to get Intuit to ban your application/remove it from AppCenter.
Or, if there really isn't anything would it be possible to close the
popped up window automatically and resume control of the previously
used tab?
Of course. In fact, you'll have to if you want to publish on AppCenter.
Simple Javascript - window.close();
Keep in mind that this window only has to be opened once and then never again. It's not like this is going to be a huge inconvenience to your users when they'll only need to do this once in the entire history of ever using your application.
I've got an asp.net page containing a Textbox with an Autocomplete extender on it.
It's setup so the user can type a short reference code into the textbox and then choose from the list of matching codes returned by the autocomplete.
On the "select", I then call the server using JQuery. I'm currently using $.get here....
The callback function from $.get checks for "success" and then displays a simple-modal dialog containing info about the item they've just selected.
if (sStatus == "success") {
$.modal(sText, {
overlayClose: true,
appendTo:'form',
onShow: function(dialog) {
$("#ccTargets_tabContainer").tabs();
},
onClose: function(dialog) {
$("#<%=TextBox1.ClientID%>").val("");
$.modal.close();
}
});
$.ready();
}
One of the bits of info being loaded here is a JQuery TABS setup, so the onShow function of the simplemodal is used to initiate the tabs which are within the simplemodal.
Now to the crux of my problem.
If I do multiple consecutive "autocompletes" on the same page it all works fine Unless I have selected a different tab on the tabs in the simplemodal ....If I select a different tab, close the simplemodal and then do another autocomplete I get a JQuery error which seems to relate to a selector doing something with the "old" selected tab that was on the "closed" modal.
I'm clearly missing some sort of cleardown / initialisation somewhere, but can't find what it is. Help?
I've tried "tabs.destroy" before the modal call in the code above and I've tried a $.ready() call as indicated too....
UPDATE: Is it something to do with JQuery Tabs appending my addressbar URL with the selected tab's ID?
I've found the problem.
It's with the "history" script that the tabs plugin normally uses. Obviously as I am continually creating and destroying popups there is no history to speak of - it's all done outside of the normal app navigation.
I've removed the jquery.history_remote script and now it works just great!
Dave
i have a dynamically created gridview button that fires off a modal popup when clicked. I do this onclientside like so:
function openModal(btnId, v) {
deptdata(v);
// __doPostBack('<%=DropDownList1.ClientID %>', '');
btn = document.getElementById(btnId);
btn.click();
}
function deptdata(v) {
document.getElementById('<%=vendor.ClientID%>').value = v;
}
This is how the function is called in the code.
btnedit.OnClientClick = String.Format("openModal('{0}','" & GridView1.Rows(i).Cells(0).Text & "');return false;", hidden.ClientID)
I set the value of a hidden field(Vendor) but I need that value for what's in the modal popup. I have a dropdown list that depends on that newly set variable. The variable is set depending on what row was clicked. So i need to somehow just reload that popup. I have an Update Panel but I can't get that Panel to reload. I've tried __doPostback and it didn't help. any ideas how to update the panel or the dropdown in the panel using javascript?
It's not very clear from your description and the limited code you provide what it is exactly that you are trying to do and what is failing. However, the following might give you some ideas. If you provide more detail and code someone might be able to give you a better answer.
ScriptManager1.RegisterAsyncPostBackControl(Button1);
to trigger an update panel post back from js make sure you use UniqueID, not ClientID, thats a common gotcha that prevents the async postback from working.
__doPostBack("<%=Button1.UniqueID %>", "");
Personally, I have all but given up on UpdatePanels, I only use them in the most trivial cases. I prefer to have my js call an ASP.Net JSON webservice and have the on completed function render any needed changes to the html. It's more flexible, lighter and infinitely faster for pages with large grids or a lot of controls.
I've posted this here, but thought it might deserve a question on its own.
What I'm trying to do is show a dialog box that asks the user if he/she wants to leave the page if there are unsaved changes. That all works fine. But the problem is described below:
Has anyone come across the problem where Internet Explorer fires the onbeforeunload event twice? While Googling around, I found it has something to do with the fact that for (among others) an ASP.NET linkbutton the HTML code is <a href="javascript: __doPostBack....
Apparently, when IE encouters a link that doesn't have a href="#", it fires the onbeforeunload event. Then, when you confirm the javascript dialog box we're showing, the page will do the 'real' unload to navigate to the other page, and raise the onbeforeunload event a second time.
A solution offered on the internet is to set a boolean variable and check on it before showing the dialog. So the second time, it wouldn't be shown. That's all well, but when the user cancels, the variable will still be set. So the next time the user wants to leave the page, the dialog won't be shown anymore.
Hope this is a little clear, and I hope someone has found a way around this?
In reaction to annakata: Yes, but you want the result of the dialog box to be used by the browser. So you might think using 'return bFlag' would do the trick (or event.returnValue = bFlag), but that gives you a second dialog box.
I've found a way around, thanks to this page. It's quite simple actually:
var onBeforeUnloadFired = false;
Use this global variable here:
if (!onBeforeUnloadFired) {
onBeforeUnloadFired = true;
event.returnValue = "You'll lose changes!";
}
window.setTimeout("ResetOnBeforeUnloadFired()", 1000);
And then implement that function:
function ResetOnBeforeUnloadFired() {
onBeforeUnloadFired = false;
}
So, in effect, use the flag, but reset it if the user clicks cancel. Not entirely what I would like, but haven't found anything better.
I haven't encountered this, but surely you could set the flag variable to be equal to the result of the dialog? If the user cancels the flag will therefore remain false.
var bFlag = window.confirm('Do you want to leave this page?');
IE supports an event on the document object called onstop. This event fires after the onbeforeunload event, but before the onunload event. This isn't exactly pertinent to your two dialogs question, but its still relevant to other people that might stumble on this thread ( as I did ).
The problem I was having, was that I needed to display a loading message upon the onbeforeunload event firing. This is all fine until the page has some sort of confirm dialog on it. The onbeforeunload event fires even if the user cancel's and remains on the page. The easiest thing for me to do was to move my "loading" display logic into a handler for document.onstop. On top of this, you have to check the readyState property of the document object, which is another IE-only field. If its "loading", it means the user is actually leaving the page. If its "complete", it means the user is staying.
If you are fine with just using IE, then you might be interested in the following.
document.onstop = function()
{
try
{
if( document.readyState != "complete" )
{
showLoadingDiv();
}
}
catch( error )
{
handleError( error );
}
}