I have a page loaded via a POST request which opens another tab programmatically like this:
Object.assign(document.createElement("a"),
{ target: "_blank", href: "foo.html"}).click();
However, what happens is that in addition to opening the new tab, it also refreshes the original page, but it does so using a GET request instead of a POST request, which means I have lost all the POST parameters sent to the original page.
Is there any way to open the new tab without refreshing the referring page?
As Keith wrote earlier:
The current code you are showing won't cause the current page to refresh,. I'm assuming your running this code on a Form, it's the form submitting that causes the refresh not this. You can use event.preventDefault on your form to stop that.
This was indeed my problem, and calling event.preventDefault() solved it. Thanks, Keith!
You can use the window.open API for this (https://developer.mozilla.org/en-US/docs/Web/API/Window/open). Just call it like this window.open('foo.html', '_blank');
Related
I'm currently using one page to spawn a new window, with a timed playback URLs in it. Many of the pages it's loading respond to hash navigation. I'm doing this like:
window.open(url,"playback");
As we play through the URLs, we should see the page respond accordingly. The problem I've run into however, is that the window.open() call actually reloads the page when the hash is changed.
For instance, loading "pageA.htm", then "pageB.htm#tab2" works flawlessly. The issue however is that when I try to go from "pageB.htm#tab2" to "pageB.htm#tab3"; the page reloads (responding properly to hash) completely instead of just firing "onhashchange" as I'd expect.
Is there an alternative to window.open() that I should call for hash-only changes, that will prevent full page reload?
Edit: The final solution looks something like this:
playbackWindow = window.open(url,"playback");
Then when we want to change the hash:
playbackWindow.location.href = "poundIt";
You can't use window.open to change the hash without reloading the page. Simply change the value of window.location.hash instead.
window.location.hash = "This";
should do the trick.
In my ASP.NET WebForms page I have a Modal window that pops up. The javascript code for displaying this modal window is as follows:
function OpenMailAddressWin(subscriberContactRelationGid, routeId, btn) {
window.showModalDialog("SubscriberSecondaryAddress.aspx" + BuildQueryStringValuesForSubscriber(subscriberContactRelationGid, routeId, returntxtReceiptDate().value), this, strWindowFeatures + ";scroll:no;dialogWidth:442px;dialogHeight:350px");
location.reload(true);
}
After the modal window is closed I need to refresh the parent page (hence the location.reload(true); statement at the end) in order for alterations made in the modal window to take affect.
Now the thing is that sometimes (not every time, infuriatingly) when I close this modal window I get a warning popup which says:
" To display the webpage again, Internet Explorer needs to resend the information you've recently submitted.
If you were making a purchase, you should click Cancel to avoid a duplicate transaction. Otherwise, click Retry to display the webpage again."
Any ideas why this is happening?
This is the double-submit problem in browsers.
When a page is loaded using POST request and you try to reload the page using location.reload(true);, the browser needs to send another POST request to the server and this may cause problems as POST is supposed to change state on the server. Therefore, the browser needs confirmation from the user. To solve this problem, we usually use POST-REDIRECT-GET pattern.
In your case, just simply using location.href = location.href should solve the problem as this will reload the page using GET.
This occurs when you try to return view(Model) from your POST request. Actually you cannot return a view from POST request because returning a view is supposed to be a GET operation and it must be done under GET request.
So after posting your data successfully and saving the data in database , you have to use ReturnToAction in your controller and return your final view from that action method.
Also If you want to refresh your page, you must use location.href = location.href instead of window.reload(), because location.href will get the data through GET request.
You can create a setTimeout function like this.
This will not give you any
setTimeout(function () {
window.parent.location.reload();
}, 100);
The Alert Message shows when refreshing a page in IE by using
That works... When you want to refresh the parent page.
This might be a valid soultion:
window.opener.location.href = window.opener.location.href;
I faced the same problem while calling modal window.
I removed location.reload and just returned true value from the function.
This solved my problem.
In my case I had something totally unrelated reloading the page, someone put some javascript code to reload the page in case of resize and it was always being triggered on document.ready, making it do the post request twice, so if none of the solutions here work just make sure that there isn't some random javascript reloading the page without you knowing about it, may be useful press F12 and check the network tab to see if something unexpected is being called.
I'm using a form handling service which after hitting submit links to an intermediate page before using setTimeout() to link back to my original page. I would like to cover the ugly intermediate page with something nicer. So far I've tried having the submit button load a new window onClick, where the new window uses parent.write to open a div that would cover the entire page and allow me to write my own html. The problem with that is that it prevents the intermediate page from loading at all, and thus prevents my forms from being processed.
My current workaround involves using setTimeout() in the child window to load my own page immediately after the intermediate page is loaded. It works, but I still see the intermediate page first.
Please help me!
switched to 000webhost and wrote my own formhandler
A site that links to mine keeps my site in a frame, so I added the following JavaScript to my page:
if (window.top.location != window.location) {
window.top.location = window.location
}
Now if I get to my site via the offending site, my site successfully breaks out of the frame. But the back button breaks! The back button sends the user to the framed version of my site, which immediately breaks out again, returning him to where he was trying to leave! Is there a simple way to fix this?
window.top.location.replace(window.location);
The replace method is specifically for this purpose. It replaces the current item in the history state with the new destination so that the back button won't go through the destination you don't want.
jfriend00's answer is indeed correct. Using the window.location.replace method will work without affecting the back button.
However, I'd just like to note that whenever you want to stop a page from being framed, you should do more than just that! There are a couple methods of preventing a simple script like that from breaking out of the frame, which work in many modern browsers. Perhaps you can disable the page, display a message with a link to the full page, something like that. You could also use the X-Frame-Options response header that tells the browser not to display the page in a frame. If you don't take some of these measures, your site could be clickjacked.
Another solution is to open your site in a new window leaving a friendly message in the iframed site:
if (parent.frames.length)
{ window.open("mySite.htm", "MySite");
location.href= "framedMessage.htm";
}
Where framedMessage.htm contains some friendly/warning message.
Hi I would like to open a page and then run some javascript functions. My problem is that once I open the window it stops running the code:
javascript:
location=("http://www.myTestPage.com/");
showForm();
document.getElementById("txtEmail").value="test#hotmail.com";
submit();
You can't. The problem is that each page is loaded into its own logical window (even if that window occupies the same client area in the browser as the previous page). Each window runs script in its own context. Usually when windows are replaced any running script is terminated and even if it weren't I suspect you want the code following the location assignment to operate on the new content.
You would need the target page to run your code for you. If the page is generated dyanmically by something like PHP or ASP then you could use the query string to specify a file that the page should point the SRC of a script block it puts at the bottom of the body content.
It's because your javascript functions are declared in the window object. By calling location= you destroy the current window object and all the function in it. After all you cant declare function in one window to run in the same same window but with another location. All you can do is toopen a new window.
It is because the page has transferred to a new location. Execute your javascript first before you move to another location.
location=("http://www.myTestPage.com/") starts the navigation to the new page. Where do you intent for showForm() to be called from? If it's the current page, I don't get why you want to do that?
This will following though I doubt you want to open a new window, yea?
window.open("http://www.myTestPage.com/");
showForm();
document.getElementById("txtEmail").value="test#hotmail.com";
submit();
To Add:
I think you wanted to submit the form to for server-side process and also navigate to the new location at the same time. Few ways to do it:
Submit the form, and let the response redirect to the desired location
Submit the form asyncronously, after that navigate to new page
This is only possible in JavaScript if you open the second page in a new window and that page is hosted on the same domain (since JavaScript has a same-domain security policy); otherwise, you'll have to do as some others have suggested and have the target page handle it itself.