HTMLOutputElement.willValidate — Eigenschaft · JavaScript-Referenz

Signatur

HTMLOutputElement.willValidate

Beschreibung

Die schreibgeschützte Eigenschaft willValidate des Interfaces HTMLOutputElement zeigt an, ob das Element beim Absenden eines Formulars geprüft wird, also ob es ein Kandidat für die Einschränkungsvalidierung (Constraint Validation) ist. Bei <output>-Elementen ist der Wert immer false.

Der Grund: Ein <output>-Element zeigt nur das Ergebnis einer Berechnung oder Benutzeraktion an. Es ist nicht zum Eingeben gedacht, wird nicht mit dem Formular übermittelt und kann darum auch nicht gegen Regeln wie required oder pattern geprüft werden.

Nützlich ist die Eigenschaft vor allem in allgemeinem Code, der über form.elements läuft und alle Steuerelemente gleich behandelt. Mit willValidate filtert man Elemente heraus, die nicht validiert werden: neben <output> auch <fieldset>, <object>, deaktivierte Felder, readonly-Felder und Buttons vom Typ button bzw. reset.

Beispiele

Wert direkt abfragen

// HTML: <form id="calc"><input name="a" type="number" value="2"> + <input name="b" type="number" value="3"> = <output name="sum" for="a b">5</output></form>
const output = document.querySelector('output[name="sum"]');
console.log(output.willValidate);

false

Nur validierbare Felder eines Formulars prüfen

const form = document.getElementById('calc');

const candidates = [...form.elements].filter((el) => el.willValidate);
const invalid = candidates.filter((el) => !el.checkValidity());

console.log('Validierbar:', candidates.map((el) => el.name));
console.log('Ungültig:', invalid.length);

Validierbar: ["a", "b"] Ungültig: 0

Validierungs-API ist vorhanden, aber ohne Wirkung

const output = document.querySelector('output');

output.setCustomValidity('Wird ignoriert');
console.log(output.willValidate);           // false
console.log(output.checkValidity());        // true – kein Kandidat, daher nie ungültig
console.log(output.validity.customError);   // true – der Fehler ist gesetzt, zählt aber nicht

false true true

// Wichtig · Fallstricke

Immer false: Anders als bei <input> hängt der Wert bei <output> weder von disabled noch von anderen Attributen ab.
Nicht beschreibbar: Eine Zuweisung wie output.willValidate = true wird im nicht-strikten Modus stillschweigend ignoriert. Im strikten Modus löst sie einen TypeError aus, weil die Eigenschaft nur einen Getter hat.
Validierung selbst bauen: Ein berechnetes Ergebnis lässt sich nicht über <output> prüfen. Prüfe dazu die zugehörigen Eingabefelder oder ein verstecktes <input> mit setCustomValidity(). Achtung: type=\"hidden\" ist ebenfalls von der Validierung ausgeschlossen.
Kein Formularwert: Ein <output> wird nicht mit dem Formular übermittelt. Wenn der Server das Ergebnis braucht, spiegle den Wert in ein eigenes Feld.
Browserunterstützung: Wird in allen modernen Browsern unterstützt. Der alte Internet Explorer kennt kein <output>.

Siehe auch

ElementInternals.willValidate HTMLOutputElement.validity HTMLOutputElement.value HTMLOutputElement.defaultValue HTMLOutputElement.labels