We Keep Coding

Submit a form from html using Javascript?

I have a form on my html page which has name="submitform" and id="submitform"
I want to submit it using Javascript with the following script on that page:
document.forms("submitform").submit();
My submit button in the form has name="btnSubmit" so it doesn't override the original function.
However, it doesn't work
I get: [Error] TypeError: '[object HTMLCollection]' is not a function (evaluating 'document.forms("submitform")'
What to do?
Thanks!
UPDATE - Full Code
<form action='/post' name='submitform' id="submitform" method='post' class='pure-form'>
<textarea columns="40" rows="4" name='entry[body]' id="statement" placeholder='enter a note here to visualize the words and their connections, you can also use #hashtags and #mentions.'><% if (url) { %><%= urltitle %> <%= url %><% } %></textarea>
<div id="addToContextsLabel">contexts:</div>
<ul id="addToContexts"></ul>
<input type="hidden" id="addedContexts" name="addedContexts">
<input type="hidden" id="context" name="context" value="<%= context %>">
<input type="hidden" id="selectedContexts" name="selectedContexts" value="">
<input type="hidden" name="statementid" value="">
<br>
<input type='submit' id="submitbutton" name="btnSubmit" value="save" class="pure-button pure-button-primary">
</form>
and
document.submitform.submit();
on the page

Use
document.forms['submitform']
instead of round braces. The Background is, that document.forms is an array type and needs to be treated as such.
You can either use the index accessor
document.forms[0]
or by name as i mentioned above.
Hope that helped!

you must submit form like this
document.forms["name of your form"].submit();

HTML - Two forms with 'enter' keypress to know which form I am entering

I have two forms and I would like to make it easy to type in one form text field and press enter and the page knows what form is being filled out.
Form 1 (example: search):
<form action="" method="post" name="form1">
<input type="text" name="txt1" />
<input type="submit" value="Enter 1" />
</form>
Form 2 (example: login):
<form action="" method="post" name="form2">
<input type="text" name="txt2" />
<input type="submit" value="Enter 2" />
</form>
Both passes through a PHP script to validate and off to its correct site.
Search is added to a page that is included in every page (MVC) header and the login is on its own page but both come together in one page as two forms. When logging in on the login page I enter username and password and press enter but it defaults to the search submit button and would like to know its being entered on the login submit button.
Appreciate your help...

If you give your submit buttons a name, you will be able to detect them in PHP.
<input type="submit" name="submit" value="Enter 2" />
and later
if ($_POST['submit'] == 'Enter 2') // ...

Since you know the field names you're looking for in each form, you can key off of that:
<?php
if (isset($_POST['txt1']) {
// do one thing
} else {
// do the other
}

<form action="" method="post" name="form1">
<input type="hidden" name="form" value="1" />
<input type="text" name="txt1" />
<input type="submit" value="Enter 1" />
</form>
<form action="" method="post" name="form2">
<input type="hidden" name="form" value="2" />
<input type="text" name="txt2" />
<input type="submit" value="Enter 2" />
</form>
The intval() will validate the posted value.
if (intval($_POST['form']) == 1){}
elseif (intval($_POST['form']) == 2){}

Taken from this article: http://www.javascript-coder.com/html-form/html-form-submit.phtml#multiple
Multiple Submit buttons
You can have more than one submit buttons in a form. But, how to identify from the server side which of the buttons was pressed to submit the form?
One way is to have different names for the submit buttons.
<input type="submit" name="Insert" value="Insert">
<input type="submit" name="Update" value="Update">
In the server side script you can do a check like this :
if(!empty($_REQUEST['Update']))
{
//Do update here..
}
else
if(!empty($_REQUEST['Insert']))
{
//Do insert Here
}
The second method is to have different values for submit buttons with the same name.
<input type="submit" name="Operation" value="Insert">
<input type="submit" name="Operation" value="Update">
The server side code goes like this (PHP code):
if($_REQUEST['Operation'] == 'Update')
{
//Do update here..
}
else
if($_REQUEST['Operation'] == "Insert")
{
//Do insert here
}

pass input value to another form on a diff url and run submit wordpress

I have 2 forms, 1st form is to submit an input value to the next page, and on the next page there's the 2nd form which is a search map function.
the 1st form is displayed on the homepage
<form role="search-map" method="" id="search-map" action="/find">
<h4>Where To Buy</h4>
<input type="text" class="form-control" id="addressInput" name="addressInput" placeholder="Your Suburb or Postcode">
<button type="submit" class="btn btn-vc btn-default btn-lg" id="search-address-btn">Find</button>
</form>
the 2nd form is on another page which is /find that has a map search plugin
<form onsubmit="cslmap.searchLocations(); return false;" id="searchForm" action="">
<input type="text" id="addressInput" name="addressInput" placeholder="Your Suburb" size="50" value="where-i-want-value-to-be-pass">
<input type="submit" class="slp_ui_button" value="Find" id="addressSubmit">
</form>
any ideas how can i pass the value from the 1st form "addressInput" to the 2nd form? and the run the search on the 2nd form? here's the 2nd form btw
i tried searching here but what i need seems to be more complex that what i have found
or maybe how can i get the 2nd page to get the value from the url (?addressInput=North+Bega%2C+NSW%2C+2550) into the 2nd form input "addressInput" and run the submit button function when the page loads?
thanks in advance guys

I'm assuming you want to get the value from s to the second form.
replace where-i-want-value-to-be-pass
with <?php echo $_REQUEST['addressInput']; ?>
<form onsubmit="cslmap.searchLocations(); return false;" id="searchForm" action="">
<input type="text" id="addressInput" name="addressInput" placeholder="Your Suburb" size="50" value="<?php echo $_REQUEST['addressInput']; ?>">
<input type="submit" class="slp_ui_button" value="Find" id="addressSubmit">
</form>

How to get form onsubmit to check terms for Google Checkout button

I'm using Google Checkout and having a problem with the onsubmit function.
I have an "Agree to terms" checkbox that I've put in place so that users must accept the terms before continuing with the checkout. I'm calling a function on the HTML form element...
function preCheckout() {
if( !document.getElementById('terms').checked ) {
// Requirements not accepted.
$('.warning').animate({top: -$('.warning').outerHeight()}, 500);
return false;
}
}
which contains the google checkout button like so:
<form method="POST"
action="https://sandbox.google.com..."
accept-charset="utf-8" onsubmit="preCheckout();">
<div>
<input type="checkbox" id="terms" name="accept_terms" value="" />
<p>I agree to all the terms and requirements...</p>
</div>
<input type="hidden" name="item_name_1" value="Simple Notes Monthly Subscription"/>
<input type="hidden" name="item_description_1" value=""/>
<input type="hidden" name="item_quantity_1" value="1"/>
<input type="hidden" name="item_price_1" value=""/>
<input type="hidden" name="item_currency_1" value="USD"/>
<input type="hidden" name="shopping-cart.merchant-private-data" value="" />
<input type="hidden" name="tax_rate" value="0.065"/>
<input type="hidden" name="tax_us_state" value="UT"/>
<input type="hidden" name="_charset_"/>
<input type="hidden" name="continue-shopping-url" value="/thankyou.php" />
<input type="image" name="Google Checkout" id="google-btn" alt="Fast checkout through Google"
src="https://checkout.google.com/buttons/checkout.gif?merchant_id=id&w=180&h=46&style=trans&variant=text&loc=en_US"
height="46" width="180"/>
</div>
</form>
However the page continues on with or without the checkbox being checked.
What am I missing?

FYI Here's the question I really meant to ask
When you right into the onsubmit line it's self, you return the true or false respectively, right? Like so:
onsubmit="return false;"
Well let's breakdown what is actually going in your code. Because you are potentially returning false in your code, here's the two possibilities of what might happen on submit.
onsubmit="false" // form is a success and performs form action
onsubmit="" // form is a success and performs form action
but what you're really looking for is onsubmit="return false;" or onsubmit="return true;" so here's what you need to do:
function preCheckout() {
if( !document.getElementById('terms').checked ) {
// Requirements not accepted.
$('.warning').animate({top: -$('.warning').outerHeight()}, 500);
return false;
}
// return true if everything is fine
return true;
}
However, the most important part is this:
<!-- all I did was add a "return" to your onsubmit -->
<form method="POST" action="https://sandbox.google.com..." accept-charset="utf-8" onsubmit="return preCheckout();">

Get the value from input using JavaScript

I have a form with an input textbox and a button. When I click on a button I want to go to a different page depending on the value of the input textbox. For example:
<form name="frm1" id="frm1" action="page.php">
<input type="text" name="txt_name" id="txt_name" value="simple text" />
<input type="button" Onclick="redirect_to('page2.php/?id=8&input=this.txt_name.value')" value="Save" />
</form>
How can I get this value? Can this be done without using a function?

Well I would recommend a function for following reasons:
Cleaner code.
Better way if you have multiple buttons.
Less code.
Better manageability.
Add this to your buttons
onclick="redirect('mytextbox.value');";
Add this to your markup inside <head>(just few lines of code):
<script type="text/javascript">
function redirect(value){
window.location="page.php/?id=8&input="+value.ToString();
}
</script>

Why wouldn't you just do this?
<form name="frm1" id="frm1" action="page2.php">
<input type="hidden" value="8" name="id" />
<input type="text" name="txt_name" id="txt_name" value="simple text" />
<input type="submit" value="Save" />
</form>

if you have something like :
<form>
<input type="text" name="formelem" />
<input type="button" />
</form>
you can put to the button :
onclick="redirect_to('page.php/?id=8&input='+this.form.formelem.value)"
you are on the button, so "this" will be the button and you need to get the form from which you can get the input
another way ( if you don't need a form for another purpose ) would be to just put :
<input type="text" id="formelem" />
<input type="button" onclick="redirect_to('page.php/?id=8&input='+document.getElementById('formelem').value)" />

onclick="window.location.href = 'page.php/?id=8&input=' +this.value.toString()"