Containervalidierung

Hintergrundinformationen

You can use a container's isValid property to check the input validation for all controls inside the container.

Dies ist einfacher, da Sie beim Erstellen Ihrer App nicht mehr jedes Steuerelement einzeln erwähnen müssen.

In diesem Beispiel erstellen wir ein einfaches Formular mit fünf Steuerelementen in einem einzigen Container:

• Two textboxes: one called Name, and a second one called Email (input type Email).
• Eine Datumsauswahl mit dem Namen „ Geburtsdatum “ .
• Eine Dropdownliste mit dem Namen Area .
• Eine Schaltfläche namens Submit .

Schritte

1. Öffnen Sie Ihre bereits vorhandene Anwendung oder starten Sie eine neue Anwendung.
2. Fügen Sie Ihrer App einen Container hinzu.
3. Add a Textbox control inside the container.
   • Benennen Sie ihn in Name um, und fügen Sie Name in der Eigenschaft Label hinzu.
   • Add =true in the Required property.
4. Fügen Sie ein Datepicker -Steuerelement innerhalb des Containers hinzu.
   • Benennen Sie es in Geburtsdatum um und fügen Sie Date of birth in der Label- Eigenschaft hinzu.
5. Add a second Textbox control inside the container.
   • Select Email as Input type.
   • Benennen Sie es in E- Mail um und fügen Sie Name in der Eigenschaft Label hinzu.
   • Add =true in the Required property.
   • Add @company.com in the Allow domain property.
6. Fügen Sie ein Dropdown -Steuerelement innerhalb des Containers hinzu.
   • Benennen Sie sie in Area um, und fügen Sie Name in der Area- Eigenschaft hinzu.
   • Add the following in the List source property: =["rural", "urban"].
   • Add =true in the Required property.
7. Add a Button control outside the container.

   • Benennen Sie es um. Senden .

   • Add the following in the Disabled property: !Container.isValid.

     

Verfahrensergebnisse

Nachdem Sie alle obigen Schritte ausgeführt haben, können Sie eine Vorschau Ihrer App anzeigen.

Während der Vorschau der App ist die Schaltfläche „Senden “ deaktiviert. Die Schaltfläche ist nur aktiviert, wenn die Felder Name , E- Mail (einschließlich der richtigen @company.com -Domäne) und Bereich ausgefüllt sind.