it-swarm-eu.dev

obtenir tous les éléments d'une forme particulière

function getInputElements() {
    var inputs = document.getElementsByTagName("input");
}

Le code ci-dessus récupère tous les éléments input d'une page comportant plusieurs formulaires. Comment obtenir les éléments input d'un formulaire particulier à l'aide de JavaScript pur?

46
manraj82
document.forms["form_name"].getElementsByTagName("input");
20
esvendsen
document.getElementById("someFormId").elements;

Cette collection contiendra également <select>, <textarea> et <button> éléments ( entre autres ), mais vous le souhaitez probablement.

109
Tim Down

Vous vous concentrez tous sur le mot "get" dans la question. Essayez la propriété 'elements' de tout formulaire qui est une collection que vous pouvez parcourir grâce à vous écrivez votre propre fonction 'get'.

Exemple:

function getFormElelemets(formName){
  var elements = document.forms[formName].elements;
  for (i=0; i<elements.length; i++){
    some code...
  }
}

J'espère que ça t'as aidé.

16
Kasim Muflahi

Il est également possible d'utiliser ceci:

var user_name = document.forms[0].elements[0];
var user_email = document.forms[0].elements[1];
var user_message = document.forms[0].elements[2];

Tous les éléments des formulaires sont stockés dans un tableau par Javascript. Cela prend les éléments de la première forme et stocke chaque valeur dans une variable unique.

7
Navigatron

Code de formulaire SIMPLE

    <form id="myForm" name="myForm">
        <input type="text" name="User" value="Arsalan"/>
        <input type="password" name="pass" value="123"/>
        <input type="number" name="age" value="24"/>
        <input type="text" name="email" value="[email protected]"/>
        <textarea name="message">Enter Your Message Her</textarea>

    </form>

Code Javascript

//Assign Form by Id to a Variabe
    var myForm = document.getElementById("myForm");
    //Extract Each Element Value
    for (var i = 0; i < myForm.elements.length; i++) {
    console.log(myForm.elements[i].value);
    }

JSFIDDLE: http://jsfiddle.net/rng0hpss/

6
Arsalan Sheikh
var inputs = document.getElementById("formId").getElementsByTagName("input");
var inputs = document.forms[1].getElementsByTagName("input");
3
epascarello

Si vous souhaitez uniquement des éléments de formulaire dotés d'un attribut name, vous pouvez les filtrer.

const form = document.querySelector("your-form")
Array.from(form.elements).filter(e => e.getAttribute("name"))
3
Raphael Rafatpanah

Utilisez ceci

var theForm = document.forms['formname']
[].slice.call(theForm).forEach(function (el, i) {
    console.log(el.value);
});

Le el représente l'élément de forme particulier. Il vaut mieux l’utiliser que la boucle foreach, car celle-ci renvoie également une fonction en tant qu’un des éléments. Cependant, cela ne renvoie que les éléments DOM du formulaire.

3
Joshua

Si vous avez une référence à un champ du formulaire ou à un événement, vous n'avez pas besoin de rechercher explicitement le formulaire car chaque champ de formulaire a un attribut form qui pointe vers son formulaire parent.

Si vous avez un événement, il contiendra un attribut target qui pointera vers le champ du formulaire qui l'a déclenché, ce qui signifie que vous pouvez accéder au formulaire via myEvent.target.form.

Voici un exemple sans code de recherche de formulaire.

<html>
<body>
    <form name="frm">
        <input type="text" name="login"><br/>
        <input type="password" name="password"><br/>
        <button type="submit" onclick="doLogin()">Login</button>
    </form>
    <script>
        function doLogin(e) {
            e = e || window.event;
            e.preventDefault();
            var form = e.target.form;
            alert("user:" + form.login.value + " password:" + form.password.value);
        }
    </script>
</body>
</html>

Si vous avez plusieurs formulaires sur la page, vous n'avez toujours pas besoin de les identifier par nom ou par id, car vous obtiendrez toujours la bonne instance de formulaire via l'événement ou via une référence à un champ.

1
ccpizza

Comment voudriez-vous différencier les formulaires? Vous pouvez utiliser différents identifiants, puis utiliser cette fonction:

function getInputElements(formId) {
    var form = document.getElementById(formId);
    if (form === null) {
        return null;
    }
    return form.getElementsByTagName('input');
}
0
Matt Ball

Essayez ceci pour obtenir tous les champs de formulaire.

var fields = document['formName'].elements;
0
Shiplu