How to submit a form using javascript?

问题:

I have a form with id theForm which has the following div with a submit button inside:

<div id=\"placeOrder\" 
     style=\"text-align: right; width: 100%; background-color: white;\">
     <button type=\"submit\" 
             class=\'input_submit\' 
             style=\"margin-right: 15px;\" 
             onClick=\"placeOrder()\">Place Order
     </button>
</div>

When clicked, the function placeOrder() is called. The function changes the innerHTML of the above div to be \"processing ...\" (so the submit button is now gone).

The above code works, but now the problem is that I can\'t get the form to submit! I\'ve tried putting this in the placeOrder() function:

document.theForm.submit();

But that doesn\'t work.

How can I get the form to submit?

回答1:

Set the name attribute of your form to \"theForm\" and your code will work.

回答2:

You can use...

document.getElementById(\'theForm\').submit();

...but don\'t replace the innerHTML. You could hide the form and then insert a processing... span which will appear in its place.

var form = document.getElementById(\'theForm\');

form.style.display = \'none\';

var processing = document.createElement(\'span\');

processing.appendChild(document.createTextNode(\'processing ...\'));

form.parentNode.insertBefore(processing, form);

回答3:

document.getElementById(\"form1\").submit();

It works perfect in my case.

you can use it in function also like,

function formSubmit()
{
     document.getElementById(\"form1\").submit();
} 

回答4:

document.forms[\"name of your form\"].submit();

or

document.getElementById(\"form id\").submit();

You can try any of this..this will definetly work..

回答5:

//Take form name as \"theForm\"
//Example:   
         ## ----Html code----- ##    
      <form method=\"post\" action=\"\" name=\"theForm\">
            <button onclick=\"placeOrder()\">Place Order</button>
      </form>

            ## -------javascript code------ ##

        function placeOrder(){
        document.theForm.action=\"yourUrl\";
        document.theForm.submit();
        }

回答6:

It is an old post but I will leave the way I do to submit the form without using name tag inside the form:

HTML

<button type=\"submit\" onClick=\"placeOrder(this.form)\">Place Order</button>

JS

function placeOrder(form){
    form.submit();
}

Hope this solution can help somebody else. TQ

回答7:

If your form does not have any id but it has a class name like theForm, you can use below statement to submit it:

document.getElementsByClassName(\"theForm\")[0].submit();

回答8:

I have came up with a easy resolve using a simple form hidden on my website with the same info the users logged in with. Example If you want a user to be logged in on this form you can add something like this to the follow form below.

<input type=\"checkbox\" name=\"autologin\" id=\"autologin\" />

as far I know i am the first to hide a form and submit it via clicking a link. There is the link submitting a hidden form with the information. Not 100% safe if you don\'t like auto login methods on your website with passwords sitting on a hidden form password text area......

Okay so here is the work. Lets say $siteid is the account and $sitepw is password.

First make the form in your php script if you dont like html in it use minimal data then echo in the value in a hidden form. I just use a php value and echo in anywhere i want pref next to the form button as you cant see it.

PHP Form to print

$hidden_forum = \'
<form id=\"alt_forum_login\" action=\"./forum/ucp.php?mode=login\" method=\"post\" style=\"display:none;\">
    <input type=\"text\" name=\"username\" id=\"username\" value=\"\'.strtolower($siteid).\'\" title=\"Username\" />
    <input type=\"password\" name=\"password\" id=\"password\" value=\"\'.$sitepw.\'\" title=\"Password\" />
</form>\';

PHP and Link to submit form

<?php print $hidden_forum; ?>
<pre><a href=\"#forum\" onClick=\"javascript: document.getElementById(\'alt_forum_login\').submit();\">Forum</a></pre>

回答9:

you can use below code to submit the form using Javascript;

document.getElementById(\'FormID\').submit();

回答10:

<html>
<body>

<p>Enter some text in the fields below, then press the \"Submit form\" button to submit the form.</p>

<form id=\"myForm\" action=\"/action_page.php\">
  First name: <input type=\"text\" name=\"fname\"><br>
  Last name: <input type=\"text\" name=\"lname\"><br><br>
  <input type=\"button\" onclick=\"myFunction()\" value=\"Submit form\">
</form>

<script>
function myFunction() {
    document.getElementById(\"myForm\").submit();
}
</script>

</body>
</html>