jquery erhält alle Eingaben aus einem bestimmten Formular

84

Gibt es Möglichkeiten, alle Eingaben aus bestimmten Formularen zu füllen? sagen wir mal so etwas:

<form id="unique00">
  <input type="text" name="whatever" id="whatever" value="whatever" />
  <div>
    <input type="checkbox" name="whatever" id="whatever" value="whatever" />
  </div>
  <table><tr><td>
    <input type="hidden" name="whatever" id="whatever" value="whatever" />
    <input type="submit" value="qweqsac" />
  </td></tr></table>
</form>
<form id="unique01">
  <div>
    <input type="text" name="whatever" id="whatever" value="whatever" />
    <input type="checkbox" name="whatever" id="whatever" value="whatever" />
  </div>
  <table><tr><td>
    <input type="hidden" name="whatever" id="whatever" value="whatever" />
  </td></tr></table>
  <select>blah...</select>
  <input type="submit" value="qweqsac" />
</form>
etc forms... forms...

* Hinweis: Jedes Formular hat möglicherweise eine andere Menge an Eingaben und Typen sowie eine andere HTML-Struktur

Gibt es also eine Möglichkeit, die Eingabe von einer bestimmten Formular-ID aus zu füllen? Wenn ich beispielsweise von einer bestimmten Formular-ID auf die Schaltfläche "Senden" klicke, füllt jquery für mich alle Eingaben in dieser Formular-ID aus. Derzeit mache ich Folgendes:

$("form").submit(function(){ return validateForm($(this)) });
function validateForm(form){
var retVal = true;
var re;
$.each(form.serializeArray(), function(i, field) {
  var input = $('input[name='+field.name+']');
  field.value = $.trim(field.value);
  switch(field.name){
    case "name" :
        and another cases...
      }
    })
 }

Das war Arbeit, aber in diesem Fall bekomme ich nur den Feldnamen und den Feldwert, und eigentlich möchte ich für jedes Eingabeelement ein Abfrageobjekt, damit ich auf deren CSS, ID, Namen und zugreifen kann animieren Sie sogar diese Eingabeelemente

Gibt es einen Weg dafür?

Bitte lassen Sie es mich wissen und bedanken Sie sich im Voraus! Und

Und
quelle

Antworten:

180

So durchlaufen Sie alle Eingaben in einem Formular:

$("form#formID :input").each(function(){
 var input = $(this); // This is the jquery object of the input, do what you will
});

Dies verwendet den Selektor jquery : input , um ALLE Arten von Eingaben abzurufen. Wenn Sie nur Text möchten, können Sie Folgendes tun:

$("form#formID input[type=text]")//...

etc.

TJB
quelle
3
Ich denke: Eingabe funktioniert dafür, aber sonst könnten Sie tun:$("form#formID input[type=text],form#formID select")
TJB
Beachten Sie Tippfehler in Ihrer ersten Antwort oben. $ ("from sollte $ sein (" Formular
Mitch
1
$("form#formID :input").eachAusgänge inputTyp, selectTyp und sogar buttonTyp Eingänge. Zumindest in meinem Code.
TARKUS
3
@TARKUS inputvs :input. $ (": input") wählt alle jQuery-Formularelemente aus. $ ("Eingabe") wählt nur Eingabe-Tags aus.
Johnathan Elmore
25

Der folgende Code hilft dabei, die Details von Elementen aus dem spezifischen Formular mit der Formular-ID abzurufen.

$('#formId input, #formId select').each(
    function(index){  
        var input = $(this);
        alert('Type: ' + input.attr('type') + 'Name: ' + input.attr('name') + 'Value: ' + input.val());
    }
);

Der folgende Code hilft dabei, die Details der Elemente aus allen Formularen abzurufen, die auf der Ladeseite platziert sind.

$('form input, form select').each(
    function(index){  
        var input = $(this);
        alert('Type: ' + input.attr('type') + 'Name: ' + input.attr('name') + 'Value: ' + input.val());
    }
);

Der folgende Code hilft dabei, die Details der Elemente abzurufen, die auf der Ladeseite platziert sind, auch wenn das Element nicht im Tag platziert ist.

$('input, select').each(
    function(index){  
        var input = $(this);
        alert('Type: ' + input.attr('type') + 'Name: ' + input.attr('name') + 'Value: ' + input.val());
    }
);

HINWEIS: Wir fügen den Namen für mehr Element-Tags, wie wir benötigen, wie folgt in die Objektliste ein:

Example: to get name of attribute "textarea",

$('input, select, textarea').each(
    function(index){  
        var input = $(this);
        alert('Type: ' + input.attr('type') + 'Name: ' + input.attr('name') + 'Value: ' + input.val());
    }
);
Srinivasan.S
quelle
1
Ich erhalte mit dieser input.val () keinen Wert für Text. Können Sie mir dabei helfen?
DhavalThakor
Mein Fehler. Sory, ich habe am falschen Ort für die Ausgabe gesucht.
DhavalThakor
3

Verwenden Sie das Attribut "Elemente" des HTML- Formulars:

$.each($("form").elements, function(){ 
    console.log($(this));
    });

Jetzt müssen keine Namen wie "Eingabe, Textbereich, Auswahl ..." usw. angegeben werden.

Markoj
quelle
Dooh! - viel zu viele Infos. Versuchen Sie eine schnellere Methode, um die Formularinformationen $ ("form: input"). Each (function (index) {console.log (index, this.type, this.id, this.name, this.value, this.placeholder) anzuzeigen );});
Jules Bartow