olivernn/davis.js

Disabling form submit button after it's clicked in non-Firefox browsers

Closed this issue · 1 comments

A common technique to avoid multiple submissions of a form by multiple clicks to the submit button is to disable the submit button when it's clicked, something like this:

  <button type="submit" onclick="this.disabled=true;">Submit</button>

This works fine in Firefox, both with and without Davis.js. But in Chrome and other browsers, it doesn't work at all because disabling the button halts form submission. A workaround to that is to do something like:

  <button type="submit" onclick="this.disabled=true; this.form.submit();">Submit</button>

That typically works fine without davis.js. However, when I'm using davis.js, it doesn't seem to handle the form submission, and instead a full page reload is triggered.

Is this a bug, or am I doing something wrong?

Looking into this I think the problem is that calling submit on a dom form element does not trigger the submit event, more info here and in the answer to this question.

You can solve this by calling submit via jQuery e.g. $(this.form).submit() as it does then fire the submit events which Davis is listening to.