This question already has answers here:
Why can't I call a function named clear from an onclick attribute?
(3 answers)
Closed 4 years ago.
onsubmit does not execute in the code snippet below when you press the submit button. It should show 'Submitting' in the javascript console when you press Submit.
function submit(v) {
console.log('Submitting');
}
<form action="#" onsubmit="submit()">
<input type=submit />
</form>
It's a name collision. Name your function something other than submit, it worked for me then.
See below:
function a () {
console.log('Submitting');
}
<form action="#" onsubmit="a()">
<input type=submit />
</form>
submit() is a predefined method in javaScript which submits a form. Just rename it to another name.
function submit2(v) {
console.log('Submitting');
}
<form action="#" onsubmit="submit2()">
<input type=submit />
</form>
Related
This question already has answers here:
Microsoft JScript runtime error: Member not found
(2 answers)
"Submit is not a function" error in JavaScript
(19 answers)
Closed 3 years ago.
//html code for form
<form id="contactform" method="post" action="/action_page.php">
//submit button html code
<input type="button" id="submit" onclick="submit_form()" value="Submit">
//javascript submit function.
function submit_form()
{
document.getElementById("contactform").submit();
return false;
}
so here are the html and javascript snippets of my contact form, now when I am debugging my javascript code it is giving me a member not found error at the document.getElementById("contactform").submit(); line. The problem still persists even though the id of my button and the name of the function that runs are different. Can somebody please help me resolve this?
The problem was your input button had an ID of submit.
I renamed that id and you can see below a working code:
function submit_form()
{
document.getElementById("contactform").submit()
return false;
}
<form id="contactform" method="post" action="/action_page.php">
<input type="button" id="hsubmit" onclick="submit_form()" value="Submit">
</form>
This question already has answers here:
behavior of javascript getElementById() when there are elements with duplicate IDs in HTML DOM?
(5 answers)
Closed 6 years ago.
I run into the bug with my multi form page:
I have two forms:
<form>
<input type="submit" id="single-submit" name="form_1" value="Submit 1"/>
</form>
<form>
<input type="submit" id="single-submit" name="form_2" value="Submit 2"/>
</form>
And this JavaScript to prevent double submit:
$("form").one('submit', function() {
$('#single-submit').prop("disabled", true);
});
I'm trying to get the submit name in php:
if(isset($_POST['form_1']))
{
// form 1 submitted
}
if(isset($_POST['form_2']))
{
// form 2 submitted
}
But JS is preventing this, why?
I can recieve submit name="" from second, third... form. But not from the first form on page.
UPDATE:
Removed double ids, added classes instead:
<form action="example.com/process" method="post" accept-charset="utf-8">
<input type="submit" class="single-submit" name="form_1" value="Submit 1"/>
</form>
<form action="example.com/process" method="post" accept-charset="utf-8">
<input type="submit" class="single-submit" name="form_2" value="Submit 2"/>
</form>
And this JavaScript to prevent double submit:
$("form").one('submit', function() {
$('.single-submit').prop("disabled", true);
});
Moreover now first AND second form does not return submit name.
Also tried on( instead, no luck.
So it seems something still wrong with JS.
Without this JS everything is working as expected.
Use a class instead of an id on this : id="single-submit".
An id must be unique.
This question already has answers here:
How send a form with Javascript when input name is "submit"?
(2 answers)
Closed 7 years ago.
I have the following form. When I have the input name set to submit, it won't submit the form, why is that?
<form id="login" method="post" action="">
<input type="hidden" name="username" value="someval">
<input type="hidden" name="userpass" value="somepass">
<input type="hidden" name="submit" value="Login">
</form>
<script type="text/javascript">
var timeout = 12;
setTimeout(function () {
document.getElementById('login').submit();
}, timeout);
</script>
Error message is:
Uncaught TypeError: document.getElementById(...).submit is not a function(…)
I guess the submit name is erasing the submit function in some way?
JSFiddle with and without submit name.
edit to my question:
How can I submit the form using js when it includes input named submit?
JavaScript has a single namespace for properties and methods. Each named field becomes a property of the form object. In your case, document.getElementById('login').submit is no longer a method, but an input field.
Because you may access child elements of the form as direct properties. So in your case:
'use strict';
let form = document.getElementById('login');
console.log(form.username, form.userpass, form.submit); // 3 input elements
So when you have an element named submit, it shadows the submit() function, and thus you get the error about it not being a function.
This question already has answers here:
How can I submit a form using JavaScript?
(10 answers)
Closed 8 years ago.
<form class="myform" action="mail.php">
Your name:<br>
<input type="text" name="myform-name"><br><br>
Your file:<br>
<input type="file" name="myform-file"><br><br>
<button type="submit">Submit</button>
</form>
How do I submit this form using vanilla javascript (not jQuery) directly from the code (without user interaction)?
You can use:
document.getElementsByTagName('form')[0].submit()
Just add a form name in your code:
<form name="myform" class="myform" action="mail.php">
Your name:<br>
<input type="text" name="myform-name"><br>
<button type="submit">Submit</button>
</form>
submit the from from javascript:
<script type="text/javascript">document.myform.submit();</script>
Use this code
document.getElementById("my_form_id").submit();
Docs here
This question already has answers here:
Submitting a form by pressing enter without a submit button
(20 answers)
Closed 8 years ago.
I have this piece of html code:
<form id="cambia_stato" method="get" action="">
<input type="text" name="stato" id="frase_stato" value=""
onclick="this.value='';" onblur="setMessaggio()" maxlength="255"
/>
</form>
and I want to check the value of the "stato" field on submit.
I tried two ways:
using onsubmit is not triggered by pressing the Enter key:
<!-- nothing happens with the following -->
<form id="cambia_stato" method="get" action="" onsubmit="myFunc()">
So I tried checking the input each time a key is pressed, changing the input attributes adding a onkeypressed event:
<!-- nothing happens with the following -->
<input type="text" name="stato" id="frase_stato" value=""
onclick="this.value='';" onblur="setMessaggio()" maxlength="255"
onkeypressed="myFunc()" />
For now, the function myFunc() is defined as follow:
function myFunc ()
{
alert('test');
}
Am I going wrong somewhere or do I need a submit button?
Add this to your javascript. This will capture the enter key.
document.onkeydown = function () {
if (event.keyCode === 13) {
myFunc();
}
};