I'm having problems resubmitting data from form in JavaScript - javascript

I have the following scenario:
The user fills an HTML form
The user presses the submit button
Something unexpectedly bad happens
The server retrieves an error page with a retry button. This page does not have the original form anymore. When the user clicks the retry button I want the last post data to be resubmitted
I don't even know if it's possible. I'm trying this on the retry button:
window.location.reload(true);
The result is:
On firefox it works perfectly. It reposts the data and shows the resulting HTML to the user.
On Google Chrome it does not repost the data, it kind of uses a GET on the same URL, I'll take a look at Fiddler to make sure
IE 9 reposts the data but shows a blank screen in return. If I reload it will show the proper page.
I'd like every of them to work as Firefox. I guess the problem is in the absense of the original form in this error page.
Is there anything I can do in JavaScript to make them all have the proper behavior?


You should include the post data in the retry form. Wrap the post data in a <form> and resubmit the form.
Form:
<form id="retryform" name="retryform" action="postfile.html" method="post">
<!-- post data -->
</form>
JS:
document.getElementById('retryform').submit();
// or
document.forms["retryform"].submit();
// or
document.retryform.submit();

Related

WooCommerce - Firefox must send information that will repeat any action

This annoying message pops up every time you try to refresh the page that you have already added the product on that page to the cart and also when you fail to save changes in user account details and try to refresh the page.
I've already read the solutions about this problem in other similar questions like:
Change your request type from POST to GET
Change the request type for reloading the page from window.location.reload(); to window.location=window.location;
Redirect users to another page
which seems like such changes should be made directly on Firefox (which is not what I want) except for redirecting users to the shopping cart (which I'm not thinking at this point unless there is no any other solutions)
I want to fix the problem for every WooCommerce user who browses the store using Firefox. so is there any way (other than redirecting) to prevent WooCommerce from triggering this warning message in Firefox?

Run page after form submit

I try to describe this problem as clear as possible.
I have an application where there is a form with some switches.
When i submit this form, the form will update an XML file with the new information.
After submitting that information, the website needs to target a page just to run, not to visit.
Example:
window.open("http://user:alarm#10.2.2.5/reload/functions.php");
The only problem here is that:
1. It doesnt run the script because the page reloads automaticly when submitting the form.
2. The user of the website visits the page, but it only needs to be run.
Someone know an fix for this?
Best Regards,
Kris

Browser: Prevent POST data resubmit on refresh using only JavaScript

I am aware of the many Post/Redirect/Get questions on here. This one is a bit different. I'm unable to find an answer that explains this particular JavaScript solution.
When you submit a form via POST and then hit the refresh button afterwards, the browser will prompt me to re-submit data. HOWEVER this prompt does not happen in the WordPress backend (when JS is enabled) and there is no Redirect/Get after the Post.
I've tried to show this in a series of screenshots below. It shows the first POST submit with the POST data printed on the page, and then the refresh causes a GET without any browser re-submit prompt.
When I disable JavaScript and hit refresh, I get the expected "Would you like to resubmit your data?" prompt and the refresh causes a second POST.
So wordpress is doing some JavaScript magic here to prevent POST data resubmission on refresh/back button.
Can anyone point me to the code in WordPress that shows how they achieve this using only JavaScript? I have no idea where to even start searching.
Do they do something with the pushstate?
Thanks!

Solution: WordPress uses window.history.replaceState on every page load.
This prevents the POST from running again on refresh or back button.
Nifty!
Non-WordPress proof of concept here: https://dtbaker.net/files/prevent-post-resubmit.php
Code is:
<script>
if ( window.history.replaceState ) {
window.history.replaceState( null, null, window.location.href );
}
</script>

Popup displaying on refresh

I have a form, with a code to show a popup when I press a create/edit link. Now when I do a page refresh, I get the following popup
I have managed to stop the popup from appearing when Retry is pressed, by handling it on the code behind of my aspx, but when Cancel is pressed, the page blinks (I guess it renders again?) and the popup is shown.
It doesn't go back to the server. It just goes to the javascript function that displays the popup, and shows it.
It should be noted at this point that this popup is just a <div> which can be shown or hidden.The default property of this <div> is hidden.
Please help me solve this issue and also explain why this is happening. I haven't been able to find anything on the internet explaining this issue.

When submitting a form, content may be sent with either POST or GET.
Sending with GET appends values to the address defining what webpage you are on. It could look like this:
www.domain.tld/page?value1=apple&value2=banana
Sending with POST sends the value in a hidden field that the server receives.
Clicking "Retry" will load the website with the information currently held within the POST field. Clicking cancel should display the address you are heading to without the POST content.
I hope this answers your question. If not, is there any way for you to show the piece of code that handles the POST data?

The browser saves the data in the form when you submit it, and when you refresh the page, the browser attempts to send this data again. The popup is a warning from the browser that this is about to happen, which is important since the form could be on a shopping site, so resending the data would result in accidentally buying the same things multiple times.
To fix this, you can redirect to another page once the form has been submitted, or you can add code to reset the form so the data won't be sent again.

We should follow a best practice to solve this problem. Better have a look at this. When you press the cancel button, it simply load the previous page and values will be persisted.

My understanding so far is that when you press the cancel button, the values for the page is taken from the browser's cache. I cleared the cache to test this theory. The cache isn't just storing the values of the page but also the last server response received. In my case, the last server response was to show the the popup by calling my javascript function, along with the required values, which is what it did.
Now my work around to it was to make the closing button as a server command as well, so that the final response would be to hide the popup.
Please do let me know if there is something wrong in this explanation.

IOS navigator.standalone mode open browser with submit button

I got a HTML page with a form. When I post, it returns a pdf based on the form data.
Is it possible to open the browser when submiting (post) the data when the user are in standalone mode?
I tried to set target="_blank" in both the form tag and on the submit button but it doesn't work.
It's not any problem if it's an a-tag link. But the problem with a link is that my form doesn't get posted (I know that I can post it trough JS but it will still be in the app).
If it isn't possible to post it with a submit button. I'll need to use a link (or another element) and with Javascript make an event that builds me the URL with a querystring with the form data. And that opens the browser and that will return me the pdf.
(However the main problem is that it isn't no way back to the app when the server give the user a pdf in app-view (standalone). And that problem isn't it any solution for what I can find. That's the reason to why I need to open it in the browser.)

Categories