How to prevent users from clicking the browser's "back" button and creating duplicates in the database?

Question

JavaScript

There is a form that the user fills out, saves, and a page opens with the newly filled form in view mode.

But especially smart users, if they notice an error, press the “back” button in the browser and return to the previous page. Make corrections and press the "save" button, an almost identical duplicate of the previous entry is created.

How to avoid such situations?

Answer 1

When issuing a form, generate in the hidden parameter some code that identifies this particular form, when receiving data from the form, check this code.

Answer 2

In view mode, make a "confirm" button and do not save to the database until this button is pressed?

Answer 3

Well, the cookies are there - everything was written. Actually, you just need to separate - this is a completely new user or not quite - an error in one field or failed verification should lead to the ability to edit the form, and not stupidly refuse or even a complete whack with filling it out again.
I make it even simpler - I just make a unique index on the key fields in the table. For example, soap - it uniquely identifies the user. Or soap plus a nickname, if it is needed (although in this case it is better to have two unique indexes for each field).
And in the case of editing, I just use replace mysql (there are some troubles, but in general it is very convenient).
And in the case of a deliberately new form - insert. And there are no duplicates.

Answer 4

Make mistakes correctable. When creating a new form, delete the old one. In short, the problem is not with users and the back button, but with your crooked application and misunderstanding of user behavior.

Answer 5

Make an AJAX form. If using History.JS, don't put the transition in history. Additionally, you can record in cookies whether there were attempts to use the form and display that the record has already been sent, etc., depending on what you have there.

Answer 6

You can also disable the button, then when you click on the "back" it will not be active.

Answer 7

Set cookies, and/or identify by ip, and do not create duplicates for users who are already marked as having completed the form.

Answer 8

It can display an inscription like: “Did you notice an error? Fix" button fix throws on the page with the data editing form. Or you can edit each field using Ajax.