Wie vermeide ich das Senden von Eingabefeldern, die durch die Anzeige ausgeblendet werden: keine an einen Server?

87

Stellen Sie sich vor, Sie haben ein Formular, in dem Sie die Sichtbarkeit mehrerer Felder wechseln. Und wenn das Feld nicht angezeigt wird, möchten Sie nicht, dass sein Wert angefordert wird.

Wie gehen Sie mit dieser Situation um?

html http field

— glaz666
quelle

128

Wenn Sie ein Formularelement auf deaktiviert setzen, wird es nicht mehr zum Server geleitet, z.

<input disabled="disabled" type="text" name="test"/>

In Javascript würde es ungefähr so viel bedeuten:

var inputs = document.getElementsByTagName('input');
for(var i = 0;i < inputs.length; i++) {
    if(inputs[i].style.display == 'none') {
        inputs[i].disabled = true;
    }
}
document.forms[0].submit();

In jQuery:

   $('form > input:hidden').attr("disabled",true);
   $('form').submit();

— karim79
quelle

16

Mit jQuerys Pseudo-Selektor :inputanstelle von können inputSie auch alle selectund textareaElemente einfach deaktivieren

— Daniel Rikowski

8

In jQuery> = 1,6, statt attr("disabled", true)Sie verwenden sollten prop("disabled", true) api.jquery.com/prop

— yorch

2

@ dominicbri7 - Ab jQuery 1.6 wird empfohlen , .prop()anstelle von .attr()zu verwenden, um deaktivierte und aktivierte Eigenschaften zu erhalten UND festzulegen . Das Überprüfen und / oder Einstellen mit .attr()wird in einigen Fällen zu unerwünschten Ergebnissen führen. Bitte lesen Sie die jQuery-Dokumentation, bevor Sie kommentieren, worauf sich yorch bezog.

— zgr024

@ zgr024 gut, löschte meinen Kommentar

— dominicbri7

2

@ DanielRikowski, was ist mit dieser jQuery hier jQuery dort Unsinn. Reden wir über Vanilla JS.

— Pacerier

13

Sie können Javascript verwenden, um das deaktivierte Attribut festzulegen. Das Klickereignis "Senden" ist wahrscheinlich der beste Ort, um dies zu tun.

Ich würde jedoch davon abraten, dies überhaupt zu tun. Wenn möglich, sollten Sie Ihre Abfrage auf dem Server filtern. Dies wird zuverlässiger sein.

— Benedict Cohen
quelle

7

Wenn Sie alle Elemente oder bestimmte Elemente in einem versteckten übergeordneten Element deaktivieren möchten, können Sie verwenden

$("div").filter(":hidden").children("input[type='text']").attr("disabled", "disabled");

In diesem Beispiel http://jsfiddle.net/gKsTS/ werden alle Textfelder in einem versteckten Div deaktiviert

— macio.Jun
quelle

Dies ist eine sehr gute Lösung, da sie durch das versteckte Div iteriert und alle deaktiviert. es sollte mehr +1 bekommen

— yeppe

6

Wie wäre es mit:

$('#divID').children(":input").prop("disabled", true); // disable

und

$('#divID').children(":input").prop("disabled", false); // enable

Umschalten aller untergeordneten Eingaben (Auswahlmöglichkeiten, Kontrollkästchen, Eingaben, Textbereiche usw.) in einem ausgeblendeten Div.

— Antonio Max
quelle

Dies ist eine großartige Lösung, wenn Sie alle Eingaben erfassen möchten. gute Arbeit

— doz87

3

Eine sehr einfache (aber nicht immer bequemste) Lösung besteht darin, das Attribut "Name" zu entfernen. Der Standard verlangt, dass Browser keine unbenannten Werte senden, und alle mir bekannten Browser halten sich an diese Regel.

— jsalvata
quelle

4

Nicht empfehlenswert, da Sie die Eingaben kaum zurücksetzen können, wenn Sie den Status über Javascript ändern, ohne alle Namensattribute zwischenzuspeichern. Es ist viel einfacher, den deaktivierten Status zu wechseln.

— Simon

1

Ich würde entweder den Wert aus der Eingabe entfernen oder das Eingabeobjekt aus dem DOM entfernen, damit es nicht existiert, um überhaupt gebucht zu werden.

— JMP
quelle