c'.forme.submit() ne fonctionne pas après avoir cliqué sur l'élément div en forme

J'étais en train de tester la soumission d'un formulaire à l'aide de clics de souris, mais la forme ne semble pas présenter à la vanille, avec javascript.

Je suis en utilisant ce simple balisage et le code:

<form name="form" id="price" action="" method="post">
<div class="category" name="price" value="50 dollars" 
onClick="this.form.submit();"
>price</div>

</form>

<?php
echo $_POST['price'];

?>

Je peux envoyer le formulaire avec Jquery, mais je ne comprends pas pourquoi this.form.submit() n'est pas de travail à la vanille, avec du javascript? Je suis en utilisant google Chrome pour tester cela.

  • Balise Div ne peut pas l'information d'attribut "value"
  • Ma réponse devrait fonctionner avec tous les navigateurs principaux. S'il vous plaît sélectionner la bonne réponse.
InformationsquelleAutor user701510 | 2011-12-05
  1. 19

    Un div n'est pas un élément de formulaire. Il n'y a pas de this.form pour elle.

    Vous pouvez toujours faire document.forms.form.submit() (.form puisque vous avez name="form")

    • Ah, ça a du sens. J'essayais de voir si je pouvais réduire la marge pour les formes à l'aide de div au lieu de input
    • Si c'est tout ce que vous voulez accomplir, je recommande que vous y allez avec un input de toute façon, comme il est construit pour être un élément de formulaire.
    • Il est plus simple de le faire. Voir ma réponse ci-dessous
    • Une question de goût, peut-être, mais en s'appuyant sur parentNode signifie que votre code ne fonctionnera plus si le balisage des changements. Si vous êtes en train de faire quelque chose de trivial comme enveloppant le bouton envoyer dans une autre div, vous pouvez vérifier si la présentation est cassé, mais vous ne pouvez pas s'attendre à ce que le changement à la pause fonctionnalités. Cette solution ne se briser si le nom de la forme change, et je dirais son nom est plus intrinsèquement liée à ses fonctionnalités. Vous ne changez pas sans approfondie des tests de fonctionnalité.
    InformationsquelleAutor David Hedlund
  2. 4

    Votre code pourrait fonctionner si vous avez essayé quelque chose comme ceci:

    onClick="document.forms["price"].submit();"

    this dans votre cas se réfère effectivement à la div tag, pas de l'objet document qui contient la référence à la forme elle-même.

    InformationsquelleAutor buruzaemon
  3. 1

    Utilisez le code suivant si votre nom est "filtre-forme"

    onclick="return document.forms.filter-form.submit();"
    • Ce qui fonctionne, mais une meilleure façon serait d'utiliser la parentNode attribut, comme par ma réponse
    InformationsquelleAutor user2629584
  4. 0

    Un div n'est pas un élément de formulaire (donc pas de .form de la propriété) et il n'a pas une valeur. Je pense que vous avez voulu <input> au lieu de <div>.

    • parfois, vous ne voulez/besoin d'utiliser un div.
    InformationsquelleAutor ThiefMaster
  5. 0

    C'est une vieille question, mais cela devrait fonctionner

    onclick="this.parentNode.form.submit()"
    • Pas mon bas-voter, mais je soupçonne que c'est parce que ce que fonctionne si il n'y a pas de nidification de balisage entre le forme et l'élément avec cet attribut. Vous pourriez avoir besoin de cette.parentNode.parentNode.forme.submit() ou pour le pire.
    InformationsquelleAutor Monarch Wadia