1

Possible Duplicate:
submit is not a function in javascript

I am trying to submit form using JS, but no luck. Here is the code. JSFIDDLE

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript">
    function validate () {
        alert('start');        
        $('#myform').submit();
        alert('end');        
    }
    </script>
</head>
<body>
    <form id="myform" name="myform" method="post" action="">
        <input type="button" value="submit" id="submit" onclick="validate();" >
    </form>
</body>
</html>

The question is "Why its not working?".

Community
  • 1
  • 1
Riz
  • 9,703
  • 8
  • 38
  • 54

5 Answers5

10

You have an form element with the id submit which conflicts with the form method submit, change the submit button id to something else.

You can access form elements as properties of the form object, so if you have a form say myForm and an input in the form with id or name submit then myForm.submit will be the input element with id submit and not the original submit method.

See http://jsfiddle.net/4kg8c/1/

Musa
  • 96,336
  • 17
  • 118
  • 137
  • Is that mean, we shouldn't name an ID to any JS function, seems strange. one is ID and other is function. – Riz Oct 13 '12 at 19:46
  • 1
    @Dev you can access form elements as properties of the form object, so if you have a form say `myForm` and an input in the form with id or name `submit` then `myForm.submit` will be the input element with id submit and not the original submit method. – Musa Oct 13 '12 at 19:50
3

The error in the console is 

Uncaught TypeError: Property 'submit' of object #<HTMLFormElement> is not a function

The problem is you hijacked the sumit() function by naming an element submit. Change the button's id to btnSubmit.

epascarello
  • 204,599
  • 20
  • 195
  • 236
  • great!!! that's the point but the ID is submit, how can that hijack submit function of JS ? – Riz Oct 13 '12 at 19:44
  • 1
    Do a console.log(document.forms[0].submit); You will see that the element is referenced and not submit. The id will take place of the name. Hence why you get the error. Never name element's submit with an id or name. – epascarello Oct 13 '12 at 19:48
1

I have modify your code with solution use that.

submit button's name is missing. and don't use name as "submit" of submit. it conflicts with JS so.

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript">
    function validate () {
        document.myform.submit();   
    }
    </script>
</head>
<body>
    <form id="myform" name="myform" method="post" action="">
        <input type="button" name="save" value="submit" id="submit" onclick="validate();" >
    </form>
</body>
</html>
w3b
  • 823
  • 6
  • 14
0

If this is the exact code you have written, then I think you have ot included jQuery library in the page.

You need to include jQuery file before you can use the $("#myform") notation.

Also specify some action URL where you want to submit the page to ?

Amogh Talpallikar
  • 12,084
  • 13
  • 79
  • 135
-1

You use jQuery code (the $ function) but you do not include the jQuery source.

fw42
  • 32
  • 1