1

When the user double clicks the submit button (or hits enter twice), the form is submitted twice.

I want it to be sent only once.

I can't use JavaScript, because of my client's request.

As a first approach, I want to find a solution without modifications on the server-side.

(I know it could be done easily if JS was enabled, or if I wanted to filter the incoming data by comparing it to the previously received ones on the server-side.)

Community
  • 1
  • 1
Tamás Bolvári
  • 2,976
  • 6
  • 34
  • 57

2 Answers2

2

Not possible. You must use js to disable the button (or otherwise prevent submission) after submission.

Remember also: No matter what you modify with js, the client can undo it with devtools. So sanitize everything server side.

Mooseman
  • 18,763
  • 14
  • 70
  • 93
  • I don't know about a solution either. But I still hope someone has an unexpected solution and shares it with us. By the way I've updated the question to clarify: I'm not looking for a hacker-proof solution, I just want to avoid accidental duplicates. I.e. a double click/enter should be filtered, but hackers can be ignored. – Tamás Bolvári Nov 21 '14 at 13:09
  • 1
    I've spent hours on finding a solution, unsuccessfully. I'll implement a filter on server-side, because I can't use JS. Otherwise I'd use this: `
    `. (If I could submit the form and check a checkbox at the same time using @mvuauja's label trick, it'd be easy without JS. Or if I could force the browser to show the requested page before it's rendered. Or if the CSS attribute selector worked real-time, to dynamically select an initially src-less iframe which is set as the target of the form...)
    – Tamás Bolvári Nov 21 '14 at 14:42
2

Some very hacky, not semantic at all, workaround with CSS that will hide a link (style it as a button) on click, but I really wouldn't recommend that - javascript is way better (this will also not stop the user from hitting enter twice).

input[type="checkbox"]:checked + label {
  display: none;
}

input[type="checkbox"] {
  display: none;
}  
<input type="checkbox" id="button-label">
<label for="button-label">
  <a class="button">click me</a>
</label>
Laura
  • 3,233
  • 3
  • 28
  • 45
  • Is it possibble to use a link for submitting a form, without using JS? I don't think so. Furthermore if I change the link to a submit button, then the checkbox won't get a synthetic click. Anyway, I like the approach, but I'd rather think about if hiding the whole form is possibble (to prevent enter as well). – Tamás Bolvári Nov 21 '14 at 11:45
  • you're right, probably not, didn't think about that. I'm afraid though you won't get anywhere without javascript then, and even that's not 100% reliable. – Laura Nov 21 '14 at 11:49
  • I'm afraid too, but I still hope someone has an unexpected solution and shares it with us. By the way I've updated the question to clarify: I'm not looking for a 100% relaible solution, I just want to avoid accidental duplicates. I.e. a double click/enter should be filtered, but hackers can be ignored. – Tamás Bolvári Nov 21 '14 at 13:11
  • if it doesn't have to be 100% reliable why not use javascript and ignore the users with javascript off? – Laura Nov 21 '14 at 13:17
  • I can't use JavaScript, because of my client's request. It's cheaper to make the product JS-less, than to provide support for customers to enable JS, or to lose them. – Tamás Bolvári Nov 21 '14 at 13:35