Menu
I am currently facing a little problem with HTTP post forms and history pushstate.
When my user submits a POST form in example.com/page-1 and then clicks on a link within this page, they are redirected to example.com/page-2 with a history.pushstate. The JS script just changes the current url, pushes the old to the history, and then displays the new content. This works perfectly fine for me.
The problem: Once the user is on example.com/page-2 and manually refreshes the page (ctrl+r or refresh button), Chromes prompts the user to submit the form again; but the form was actually in example.com/page-1 and there is no reason to asked it again in this "new" page.
Is there a way to clear all the previously-submitted data in javascript on the popstate change to prevent repost prompt from the browser? Or am I missing something with my history states? Or is it something currently not implemented by the browser well yet?
I only tested it with chrome since I don't implement pushstate with other browsers.
560
In an HTML document, the history. pushState() method adds an entry to the browser's session history stack.
The big difference is, that while pushState will create a new entry in the browser's history, replaceState will only replace the current state. As a side effect of this, using the replaceState method will change the URL in the address bar, without creating a new history entry.
The history. pushState() method can be used to push a new entry into the browser's history—and as a result, update the displayed URL—without refreshing the page. It accepts three arguments: state , an object with some details about the URL or entry in the browser's history.
The History. replaceState() method modifies the current history entry, replacing it with the state object and URL passed in the method parameters. This method is particularly useful when you want to update the state object or URL of the current history entry in response to some user action.
Maybe try replaceState instead? See this.
The
replaceState()methodhistory.replaceState() operates exactly like history.pushState() except that replaceState() modifies the current history entry instead of creating a new one.
replaceState() is particularly useful when you want to update the state object or URL of the current history entry in response to some user action.
67
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
