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?

Answers:

Answer

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

Answer

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);
Answer

It works perfectly in my case.

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

Also, you can use it in function as below:

function formSubmit()
{
     document.getElementById("form1").submit();
} 
Answer
document.forms["name of your form"].submit();

or

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

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

Answer

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

Answer

HTML

<!-- change id attribute to name  -->

<form method="post" action="yourUrl" name="theForm">
    <button onclick="placeOrder()">Place Order</button>
</form>

JavaScript

function placeOrder () {
    document.theForm.submit()
}
Answer

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();
Answer

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>
Answer

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

document.getElementById('FormID').submit();
Answer
<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>

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.