html - "Submit is not a function" error in JavaScript - Stack Overflow

admin管理员组

文章数量:1126446

Can anyone tell me what is going wrong with this code? I tried to submit a form with JavaScript, but an error ".submit is not a function" shown. See below for more details of the code:

<form action="product.php" method="get" name="frmProduct" id="frmProduct" enctype="multipart/form-data">

<input onclick="submitAction()" id="submit_value" type="button" name="submit_value" value="">

</form>

<script type="text/javascript">
    function submitAction()
    {
        document.frmProduct.submit();
    }
</script>

I also tried this:

<script type="text/javascript">
    function submitAction()
    {
        document.forms["frmProduct"].submit();
    }
</script>

Both show me the same error :(

Can anyone tell me what is going wrong with this code? I tried to submit a form with JavaScript, but an error ".submit is not a function" shown. See below for more details of the code:

<form action="product.php" method="get" name="frmProduct" id="frmProduct" enctype="multipart/form-data">

<input onclick="submitAction()" id="submit_value" type="button" name="submit_value" value="">

</form>

<script type="text/javascript">
    function submitAction()
    {
        document.frmProduct.submit();
    }
</script>

I also tried this:

<script type="text/javascript">
    function submitAction()
    {
        document.forms["frmProduct"].submit();
    }
</script>

Both show me the same error :(

• javascript
• html
• dom
• submit

Share Improve this question Follow edited Dec 16, 2014 at 11:23 trejder 17.5k2727 gold badges129129 silver badges224224 bronze badges asked May 7, 2009 at 5:41 Jin YongJin Yong 43.7k7272 gold badges144144 silver badges193193 bronze badges 4

• Which browser gives you this message? Can you post the complete source? – harto Commented May 7, 2009 at 6:05
• Considering that the posted code works for me in both IE7 and Chrome2, then perhaps there is something wrong in code you haven't posted? – Lasse V. Karlsen Commented May 7, 2009 at 12:21
• 23 Perhaps you have a field with the name or id submit and thus .submit() is shadowed by that field? – Lasse V. Karlsen Commented May 7, 2009 at 12:22
• that error occurred when you have same id="frmProduct" in different elements. – Optimaz Prime Commented Aug 30, 2018 at 4:03

Add a comment  | 

19 Answers 19

Sorted by: Reset to default 924

submit is not a function

means that you named your submit button or some other element submit. Rename the button to btnSubmit and your call will magically work.

When you name the button submit, you override the submit() function on the form.

Make sure that there is no another form with the same name and make sure that there is no name="submit" or id="submit" in the form.

If you have no opportunity to change name="submit" you can also submit form this way:

function submitForm(form) {
    const submitFormFunction = Object.getPrototypeOf(form).submit;
    submitFormFunction.call(form);
}

<form action="product.php" method="post" name="frmProduct" id="frmProduct" enctype="multipart/form-data">

<input id="submit_value" type="button" name="submit_value" value="">

</form>

<script type="text/javascript">

document.getElementById("submit_value").onclick = submitAction;

function submitAction()
{
    document.getElementById("frmProduct").submit();
    return false;
}
</script>

EDIT: I accidentally swapped the id's around

form.submit() will not work if the form does not have a <button type="submit">submit</button>. form element belongs to HTMLFormElement interface, therefore, we can call from prototype directly, this method will always work for any form element.

HTMLFormElement.prototype.submit.call(form)

I had the same issue when i was creating a MVC application using with master pages. Tried looking for element with 'submit' as names as mentioned above but it wasn't the case.

For my case it created multiple tags on my page so there were some issues referencing the correct form.

To work around this i'll let the button handle which form object to use:

onclick="return SubmitForm(this.form)"

and with the js:

function SubmitForm(frm) {
    frm.submit();
}

This topic has a lot of answers already, but the one that worked best (and simplest - one line!) for me was a modification of the comment made by Neil E. Pearson from Apr 21 2013:

If you're stuck with your submit button being #submit, you can get around it by stealing another form instance's submit() method.

My modification to his method, and what worked for me:

document.createElement('form').submit.call(document.getElementById(frmProduct));

I had same issue and resolved my issue just remove name="submit" from submit button.

<button name='submit' value='Submit Payment' ></button>

Change To

<button value='Submit Payment' ></button>

remove name attribute hope it will work

I was facing the same problem that my submit() wasn't working. In my case, I'd an id="submit" on the input tag having type="submit", I removed the id, and it started working.

giving a form element a name of submit will simple shadow the submit property . make sure you don't have a form element with the name submit and you should be able to access the submit function just fine .

In fact, the solution is very easy...

Original:

    <form action="product.php" method="get" name="frmProduct" id="frmProduct"
enctype="multipart/form-data">
    <input onclick="submitAction()" id="submit_value" type="button" 
    name="submit_value" value="">
</form>
<script type="text/javascript">
    function submitAction()
    {
        document.frmProduct.submit();
    }
</script>

Solution:

    <form action="product.php" method="get" name="frmProduct" id="frmProduct" 
enctype="multipart/form-data">
</form>

<!-- Place the button here -->
<input onclick="submitAction()" id="submit_value" type="button" 
    name="submit_value" value="">

<script type="text/javascript">
    function submitAction()
    {
        document.frmProduct.submit();
    }
</script>

Sorry to answer late but for those who are still facing the same error. To get rid of this error:

<form method="POST">
  <input type="text"/>
  <input type="submit" id="submit-form" value="Submit Form" style="display: none;"/>
</form>

<!-- Other element that will submit the form -->
<button onclick="submitTheForm()">Submit the form</button>

<script>
function submitTheForm(){
  document.getElementById("submit-form").click();
}
</script>

Explanation:

The javascript function submitTheForm() is accessing the submit input element and calling the click event on it which results in the form submission.

This solution is lifetime and almost 100% compatible in all browsers.

Possible solutions -
1.Make sure that you don't have any other element with name/id as submit.
2.Try to call the function as onClick = "return submitAction();"
3.document.getElementById("form-name").submit();

You should use this code :

$(document).on("ready", function () {
       
        document.frmProduct.submit();
    });

What I used is

var enviar = document.getElementById("enviar");
enviar.type = "submit"; 

Just because everything else didn´t work.

Solution for me was to set the "form" attribute of button

<form id="form_id_name"><button name="btnSubmit" form="form_id_name" /></form>

or is js:

YOURFORMOBJ.getElementsByTagName("button")[0].setAttribute("form", "form_id_name");
YOURFORMOBJ.submit();

I faced this issues also but i made a quick fix using

const form = document.getElementById('create_user_form');

function onSubmit(event) {
  console.log(event.target[0].value);

  console.log(form.submit); // 

                本文标签：
                htmlquotSubmit is not a functionquot error in JavaScriptStack Overflow

                        版权声明：本文标题：html - "Submit is not a function" error in JavaScript - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人，
                        转载请联系作者并注明出处：http://www.betaflare.com/web/1736689701a1947856.html，
                        本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。