Erreur «Soumettre n'est pas une fonction» en JavaScript

264

Quelqu'un peut-il me dire ce qui ne va pas avec ce code? J'ai essayé de soumettre un formulaire avec JavaScript, mais une erreur ".submit is not a function" s'est affichée. Voir ci-dessous pour plus de détails sur le 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>

J'ai également essayé ceci:

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

Les deux me montrent la même erreur :(

Jin Yong
la source
Quel navigateur vous donne ce message? Pouvez-vous publier la source complète?
harto
Étant donné que le code publié fonctionne pour moi à la fois dans IE7 et Chrome2, alors peut-être qu'il y a quelque chose de mal dans le code que vous n'avez pas publié?
Lasse V. Karlsen
11
Peut-être avez-vous un champ avec le nom ou l'identifiant submit et donc .submit () est masqué par ce champ?
Lasse V. Karlsen
cette erreur s'est produite lorsque vous avez le même id = "frmProduct" dans différents éléments.
Optimaz ID

Réponses:

736

soumettre n'est pas une fonction

signifie que vous avez nommé votre bouton d'envoi ou un autre élément submit. Renommez le bouton btnSubmitet votre appel fonctionnera comme par magie.

Lorsque vous nommez le bouton soumettre, vous remplacez la submit()fonction sur le formulaire.

epascarello
la source
55
Voici une astuce pratique. Si vous êtes coincé avec votre bouton submit être #submit, vous pouvez contourner le problème en volant d' une autre forme par exemple submit()la méthode, par exemple: document.createElement('form').submit.call(document.frmProduct).
Neil E. Pearson
35
Il semble que tout le monde doit apprendre celui-ci à la dure.
Ferait
9
J'ai simplement supprimé le nom = «soumettre» et Bob est votre tante, cela a fonctionné !!
zzapper
2
Étonné, je n'ai jamais rencontré cela, mais hélas, c'était le problème!
natebeaty
3
Je viens de perdre mes 2-3 heures pour ce problème, merci beaucoup pour la réponse
Mehul Prajapati
12
<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: J'ai accidentellement échangé l'id autour

Chad Grant
la source
document.getElementById ("frmProduct"). submit n'est pas une fonction :(
Jin Yong
1
Avez-vous plusieurs éléments avec l'ID 'frmProduct'?
tvanfosson
L'ajout de submitAction en tant que gestionnaire pour onsubmit puis l'invocation de submit à partir de celui-ci peut créer une boucle infinie. Le gestionnaire doit être associé à un clic du bouton.
tvanfosson
1
Dévoter des réponses précises hein? les gars boiteux, marchez sur nous pour obtenir ces points pour lesquels vous vendez vos âmes
Chad Grant
@Chad Grant - Je ne pourrais pas être plus d'accord.
Fenton
10

Assurez-vous qu'il n'y a aucun autre formulaire portant le même nom et assurez-vous qu'il n'y a pas de nom = "soumettre" ou id = "soumettre" dans le formulaire.

gopeca
la source
9

Si vous n'avez pas la possibilité de changer, name="submit"vous pouvez également soumettre le formulaire de cette façon:

function submitForm(form) {
    var submitFormFunction = Object.getPrototypeOf(form).submit;
    submitFormFunction.call(form);
}
Terbiy
la source
5
HTMLFormElement.prototype.submit.call(form)fonctionne également
musa
5

J'ai eu le même problème lorsque je créais une application MVC avec des pages maîtres. J'ai essayé de rechercher un élément avec «soumettre» comme noms comme mentionné ci-dessus, mais ce n'était pas le cas.

Pour mon cas, il a créé plusieurs balises sur ma page, il y avait donc des problèmes référençant le bon formulaire.

Pour contourner cela, je laisse le bouton gérer quel objet de formulaire utiliser:

onclick="return SubmitForm(this.form)"

et avec le js:

function SubmitForm(frm) {
    frm.submit();
}
Quangahh
la source
3

Ce sujet a déjà beaucoup de réponses, mais celui qui a le mieux fonctionné (et le plus simple - une ligne!) Pour moi était une modification du commentaire fait par Neil E. Pearson du 21 avril 2013:

Si vous êtes bloqué avec votre bouton d'envoi #submit, vous pouvez le contourner en volant la méthode submit () d'une autre instance de formulaire.

Ma modification de sa méthode et ce qui a fonctionné pour moi:

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

jlemley
la source
2

donner à un élément de formulaire un nom de soumission masquera simplement la propriété submit. assurez-vous que vous n'avez pas d'élément de formulaire avec le nom soumettre et vous devriez pouvoir accéder à la fonction de soumission très bien.

Ahmed Eid
la source
2

En fait, la solution est très simple ...

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>
Zurc Soirrab
la source
Pouvez-vous expliquer comment cela résout le problème du PO?
Kingsley
Pour sûr, dans ce cas (uniquement dans ce cas), le problème est la portée.
Zurc Soirrab le
1

Vous devez utiliser ce code:

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

AnilSengul
la source
Bien que cet extrait de code puisse résoudre la question, y compris une explication aide vraiment à améliorer la qualité de votre message. N'oubliez pas que vous répondrez à la question pour les lecteurs à l'avenir, et ces personnes pourraient ne pas connaître les raisons de votre suggestion de code. Essayez également de ne pas surcharger votre code avec des commentaires explicatifs, cela réduit la lisibilité du code et des explications!
Filnor
0

Ce que j'ai utilisé c'est

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

Tout simplement parce que tout le reste n'a pas fonctionné.

compraspro.com
la source
0

La solution pour moi était de définir l'attribut "formulaire" du bouton

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

ou est js:

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

Solutions possibles -
1.Assurez-vous que vous n'avez aucun autre élément avec le nom / id comme soumis.
2.Essayez d'appeler la fonction en tant que onClick = "return submitAction();"
3.document.getElementById("form-name").submit();

Ram Thota
la source
-1

Tu peux essayer

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

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

</form>

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

N'avez-vous pas plus d'un formulaire du même nom?

Fabien Ménager
la source
-1

Utilisez getElementById:

document.getElementById ('frmProduct').submit ()
Ilya Birman
la source