Fields
Das webforJ-Framework unterstützt sieben verschiedene Typen von Komponenten für Eingabefelder, die jeweils unterschiedliche Verhaltensweisen und Implementierungen aufweisen, die verschiedenen Anforderungen für Eingaben entsprechen. Obwohl jede dieser Komponenten Variationen in ihren Implementierungen hat, beschreibt dieser Artikel die gemeinsamen Eigenschaften aller Feldklassen.
Dieser Abschnitt beschreibt gemeinsame Merkmale verschiedener Feldkomponenten in webforJ und ist selbst keine Klasse, die instanziiert und verwendet werden kann.
Gemeinsame Feld Eigenschaften
Label
Ein Feldlabel ist ein beschreibender Text oder Titel, der mit dem Feld verknüpft ist und im Konstruktor oder durch die Verwendung der Methode setLabel()
definiert werden kann. Labels bieten eine kurze Erklärung oder Aufforderung, die den Benutzern hilft, den Zweck oder die erwartete Eingabe für dieses bestimmte Feld zu verstehen. Feldlabels sind wichtig für die Benutzerfreundlichkeit und spielen eine entscheidende Rolle für die Barrierefreiheit, da sie es Bildschirmlesegeräten und unterstützenden Technologien ermöglichen, genaue Informationen bereitzustellen und die Navigation über die Tastatur zu erleichtern.
Hilfetext
Jedes Feld kann Hilfetext unter der Eingabe anzeigen, indem die Methode setHelperText()
verwendet wird. Dieser Hilfetext bietet zusätzliche Kontextinformationen oder Erklärungen zu den verfügbaren Eingaben, um sicherzustellen, dass die Benutzer die notwendigen Informationen haben, um informierte Entscheidungen zu treffen.
Erforderlich
Sie können die Methode setRequired(true)
aufrufen, um zu verlangen, dass die Benutzer einen Wert angeben, bevor sie ein Formular absenden. Dieses Attribut funktioniert zusammen mit dem Feldlabel und bietet eine visuelle Anzeige dafür, dass ein Feld erforderlich ist. Dieses visuelle Signal hilft den Personen, Formulare korrekt auszufüllen.
Feldkomponenten enthalten eingebaute visuelle Validierung, um die Benutzer zu benachrichtigen, wenn ein erforderliches Feld leer ist oder wenn ein Benutzer einen Wert entfernt hat.
Rechtschreibprüfung
Durch die Verwendung von setSpellCheck(true)
können Sie dem Browser oder Benutzeragenten erlauben, die Rechtschreibung des vom Benutzer eingegebenen Textes zu überprüfen und Fehler zu identifizieren.
Präfix und Suffix
Slots bieten flexible Optionen zur Verbesserung der Fähigkeit von Feldkomponenten. Sie können Symbole, Labels, Lade-Symbole, die Möglichkeit zum Löschen/Zurücksetzen, Avatare/Profilbilder und andere nützliche Komponenten innerhalb eines Feldes einfügen, um den Benutzern die beabsichtigte Bedeutung besser zu verdeutlichen.
Felder haben zwei Slots: die prefix
- und suffix
-Slots. Verwenden Sie die Methoden setPrefixComponent()
und setSuffixComponent()
, um verschiedene Komponenten vor und nach der angezeigten Option innerhalb eines Feldes einzufügen. Hier ist ein Beispiel mit dem TextField
-Feld:
TextField textField = new TextField();
textField.setPrefixComponent(TablerIcon.create("box"));
textField.setSuffixComponent(TablerIcon.create("box"));
Styling
Da alle Feldkomponenten aus einer einzigen Webkomponente erstellt werden, teilen sie sich alle die folgenden Schattenkomponenten und CSS-Property-Werte.
Themen
🗃️ Maskierte Felder
4 Einträge
📄️ ColorField
A component that provides a default browser-based color picker, allowing users to select a color from an input field.
📄️ DateField
A component that provides a default browser-based date picker for selecting a date through an input field.
📄️ DateTimeField
A component that provides a default browser-based date and time picker for selecting both date and time through a single input field.
📄️ NumberField
A component that provides a default browser-based input field for entering numeric values, with built-in controls for incrementing or decrementing the value.
📄️ PasswordField
A single-line input component for securely entering and masking password data.
📄️ TextField
A single-line input component for entering and editing text data.
📄️ TimeField
A component that provides a default browser-based time picker for selecting a time value through an input field.