Boucle sur les éléments dans jQuery

Je veux faire une boucle sur les éléments d'un formulaire HTML, et de stocker les valeurs de la <input> les champs d'un objet. Le code suivant ne fonctionne pas, cependant:

function config() {
    $("#frmMain").children().map(function() {
        var child = $("this");
        if (child.is(":checkbox"))
            this[child.attr("name")] = child.attr("checked");
        if (child.is(":radio, checked"))
            this[child.attr("name")] = child.val();
        if (child.is(":text"))
            this[child.attr("name")] = child.val();
        return null;
    });

Ni le suivant (inspiré par jobscry réponse):

function config() {
    $("#frmMain").children().each(function() {
        var child = $("this");
        alert(child.length);
        if (child.is(":checkbox")) {
            this[child.attr("name")] = child.attr("checked");
        }
        if (child.is(":radio, checked"))
            this[child.attr("name")] = child.val();
        if (child.is(":text"))
            this[child.attr("name")] = child.val();
    });
}

L'alerte indique toujours que child.length == 0. En sélectionnant manuellement les éléments œuvres:

 
>>> $("#frmMain").enfants (les) 
Objet longueur=42 
>>> $("#frmMain").les enfants().filtre ("case") 
Objet longueur=3

Tous les conseils sur la façon de faire la boucle correctement?

  • Votre thread juste m'a sauvé 20 minutes de, ligne par ligne, les champs d'entrée pour de multiples formes -_-;. +1.
InformationsquelleAutor Christian Aichinger | 2008-10-04
  1. 40

    ne pense pas que vous avez besoin de citations sur ce:

    var child = $("this");

    essayer:

    var child = $(this);
    • Wow bon catch - je n'ai pas remarqué que
    • Merci! Cela fonctionne pour moi maintenant.
    InformationsquelleAutor imjoevasquez
  2. 28

    jQuery a une excellente fonction pour la lecture en boucle par le biais d'un ensemble d'éléments: .chacun()

    $('#formId').children().each(
    function(){
        //access to form element via $(this)
    }
);
    • Ne fonctionne pas pour moi, voir mon edit de la question. D'autres idées?
    • Le formulaire de chances d'avoir un paragraphe ou quelque chose de similaire comme son enfant. Vous devez assurez-vous de sélectionner uniquement les éléments d'entrée.
    • "les enfants()" récupère tous les DOM les enfants au sein de la forme, pas les éléments.
    InformationsquelleAutor imjoevasquez
  3. 13

    En fonction de ce que vous avez besoin de chaque enfant (si vous êtes à la recherche pour le poster quelque part via AJAX), vous pouvez simplement faire...

    $("#formID").serialize()

    Il crée une chaîne de caractères pour vous, avec toutes les valeurs automatiquement.

    Comme pour faire une boucle à travers les objets, vous pouvez aussi le faire.

    $.each($("input, select, textarea"), function(i,v) {
    var theTag = v.tagName;
    var theElement = $(v);
    var theValue = theElement.val();
});
    InformationsquelleAutor Hugoware
  4. 3

    J'ai utilisé les informations suivantes avant de:

    var my_form = $('#form-id');
var data = {};

$('input:not([type=checkbox]), input[type=checkbox]:selected, select, textarea', my_form).each(
    function() {
        var name = $(this).attr('name');
        var val = $(this).val();

        if (!data.hasOwnProperty(name)) {
            data[name] = new Array;
        }

        data[name].push(val);
    }
);

    C'est juste écrit à partir de la mémoire, donc susceptible de contenir des erreurs, mais cela devrait rendre un objet appelé data qui contient les valeurs pour toutes vos entrées.

    Note que vous avez à traiter avec des cases à cocher dans une manière spéciale, pour éviter d'obtenir les valeurs de décoché les cases à cocher. La même chose est probablement le cas de l'entrée radio.

    Notez également l'utilisation des tableaux pour stocker les valeurs, comme pour une entrée de nom, vous pourriez avoir des valeurs à partir de plusieurs entrées (cases à cocher en particulier).

    • Pourquoi êtes-vous l'écriture de $(ce) deux fois....pourquoi ne pas mettre en cache la recherche
    • Avez-vous me voter pour? $(ce) n'est pas une recherche, vous enchaînez un objet existant dans un objet jQuery. Il pourrait être légèrement plus efficace de le faire seulement une fois, mais la différence sera minime.
    • De toutes les nombreuses suggestions que j'ai vu, c'est le plus facile à mettre en œuvre. Merci!
    InformationsquelleAutor SpoonMeiser
  5. 0

    si vous souhaitez utiliser la fonction de chaque, il devrait ressembler à ceci:

    $('#formId').children().each( 
  function(){
    //access to form element via $(this)
  }
);

    Il suffit de passer l'accolade fermante pour fermer la parenthèse. Merci pour ça, jobscry, vous m'avez sauvé un certain temps.

    • Pourquoi êtes-vous cela comme une réponse quand vous dites que vous êtes tout simplement la réponse à jobscry? C'est le même code, il a posté. C'est ce que les commentaires sont pour.
    InformationsquelleAutor Peter
  6. 0

    pour moi tous ces n'a pas fonctionné. Ce qui a fonctionné pour moi était quelque chose de vraiment simple:

    $("#formID input[type=text]").each(function() {
alert($(this).val());
});
    InformationsquelleAutor bicycle
  7. -1

    C'est la façon la plus simple de boucle par le biais d'un formulaire d'accéder uniquement les éléments du formulaire. À l'intérieur de chaque fonction, vous pouvez vérifier et de construire ce que vous voulez. Lors de la construction d'objets remarque que vous aurez envie de le déclarer à l'extérieur de la fonction de chaque.

    MODIFIER
    JSFIDDLE

    Le ci-dessous

    $('form[name=formName]').find('input, textarea, select').each(function() {
    alert($(this).attr('name'));
});
    • $('#formId input, select, textarea') sera de retour tous les input éléments dans la forme, avec chaque zone de select et textarea de la page.
    • Il fait doent se comporter comme ça... l'Utilisation de cette forme exacte dans JSFiddle fait, seul le select et textarea écho. L'ajout d'une virgule devant " l'entrée des résultats de ce que vous dites.
    • Vraiment? Cause jsfiddle.net/UDD7E/3 montre exactement de quoi je parlais. Sélectionnez les boîtes et les deux textareas sont le rouge, même si l'un de chacun est à l'extérieur de la forme.
    • Intéressant, j'ai obtenu des résultats différents. Peut-être que c'est parce que je l'ai lancé sur un clic de bouton. Très étrange. Je jetterais un violon mais n'a plus d'importance.
    • Juste remarqué la modifier. Le nouveau code devrait fonctionner mieux, que vous êtes saisissant la forme et l'interrogation (ce qui restreint la requête d'une manière autre code n'a pas). Le code ci-dessus, il est toujours en panne, et vous pourriez se débarrasser de lui, mais au moins vous avez quelque chose qui fonctionne maintenant. 🙂
    • Comment est-il encore cassé? J/w
    • C'est toujours en panne parce que les virgules séparent les sélecteurs. form[name=formname] input, select, textarea signifie "tous les inputs dans le formulaire nommé formname, en plus de tous les selects, en plus de tous les textareas". Vous pourriez être en mesure de dire $('input, select, textarea', 'form[name=formname]') et de le faire travailler; j'oublie que jQuery vous permet de le faire ou le fait que vous utilisez un élément ou un objet jQuery en tant que contexte.
    • Oh, vous êtes toujours regarder le haut des vieux trucs... et, de les modifier dans la partie inférieure qui fonctionne et qui est dans le JSFiddle
    • Ouais..c'est ce que je disais. Bas ça marche. Le code ci-dessus, il devrait probablement être prises, comme il est incorrect.
    • Tous partis maintenant 😀

    InformationsquelleAutor Scottzozer