How to reliably submit an HTML form with JavaScript?

Question

Is there a way to submit an HTML form using JavaScript that is guaranteed to work in all situations?

I elaborate. The common approach seems to be:

fo         


        

Answer 1

So, is there any other way to submit an HTML form using JavaScript?

Update: Take the advice of Jerome (elsewhere in this thread). I'll leave this answer up for historical interest, but it isn't as nice or reliable as Jerome's solution.

The following approach is ugly, but works.

    var x = document.forms.example;
    var f = document.createElement('form');
    f.action = x.action;
    f.method = x.method;
    f.enctype = x.enctype;
    for (var i = 0; i < x.elements.length; i++) {
        var el = x.elements[i];
        if (el.name !== "submit") {
            f.appendChild(el);
        }
    }
    x.parentNode.replaceChild(f,x);
    f.submit();

Answer 2

For a form named submit just calling its buttons click function works for me.

document.forms[0].submit.click();  //where submit here is just the name of the button/input tied to the form.

Answer 3

Just use onsubmit ...

<form name="example" id="example" action="/" onsubmit="document.example.submit();">
  <button type="submit" name="submit" onclick="document.example.submit(); return false;">Submit</button>
</form>

Answer 4

The best idea is to not name a submit button 'submit', but you can get around it-

function reallysubmitform(n){
 n= n || 0;
 var f= document.forms[n];
 f.onsubmit= function(){
  return true
 };
 var sub= f.elements['submit'];
 if(sub && sub.type== 'submit') sub.click();
 else f.submit();
}

reallysubmitform()

Answer 5

Submiting a form using JavaScript cannot by design be safe.

Your users can browse your web site on their phone, have disabled JavaScript, tweaked the source of your page, or using Lynx.

In any case, for accessibility purposes, you will need the good old HTML submit button and some input checks on the server side.

Answer 6

In Firefox

formElement.constructor

returns "HTMLFormElement". So you can submit the form by using:

HTMLFormElement.prototype.submit.call(formElement)

You can extend this to other browsers as well:

formElement.constructor.prototype.submit.call(formElement)