SharePoint Konferenz 2014 Munich - Wie Sie Office 365 mit Windows Azure steue...
Let your clients do the work - Client side validations in APEX 5.1
1. Let Your Clients do the
Work
Steven Grzbielok:
11.05.2017 | APEX connect
2017
2. Facts & Figures
Mittelständischer IT-Dienstleister
Technologie-orientiert
Branchen-unabhängig
Hauptsitz
Ratingen
240
Beschäftigte
Gründung
1994
Niederlassung
Frankfurt am Main
Ausbildungs-
betrieb
Inhabergeführt
Zertifizierter
Partner von
Oracle,
Microsoft
und SAP
28 Mio. Euro
Umsatz
2
Managing
Technology
3. Steven Grzbielok
Seit 08.2014 Berater bei der MT AG in Ratingen
B.Sc. in Wirtschaftsinformatik, M.Sc. in Arbeit
Beschäftigt sich seit 2014 mit Oracle Application Express
und Oracle Datenbanken
APEX Showcase https://apex.mt-ag.com/
Twitter https://twitter.com/sgrzbielok
3
Über mich
6. Problematik
Belastung des Servers bei jeder fehlerhaften Eingabe
Nutzer erkennt nur Fehler beim Submit
Nutzer muss ggf. Eingaben wiederholen
6
7. Lösung: Client-seitige Validierungen
Validierungen auf dem Clientsystem
Entlastung des Servers
Client-State erhalten
Zeitnah nach der Eingabe, ohne Submit
Kürzere Korrekturschleifen durch den Nutzer
7
10. HTML5 Constraints
10
Validierungsergebnisse gestalten: Pseudo-Klassen
Selector Description
:disabled Selects input elements with the "disabled" attribute
specified
:invalid Selects input elements with invalid values
:optional Selects input elements with no "required" attribute
specified
:required Selects input elements with the "required" attribute
specified
:valid Selects input elements with valid values
13. Neue APIs
apex.page.validate
apex.item getValidity und getValidationMessage
13
Neu in APEX 5.1
http://hardlikesoftware.com/weblog/2017/05/10/apex-client-side-validation/
14. Mögliche Implementierung der Validierung als Dynamic Action
14
JavaScript APIs
Neu in APEX 5.1
http://hardlikesoftware.com/weblog/2017/05/10/apex-client-side-validation/
15. APEX out of the box
Required
Zeichenbegrenzungen
Subtype
Email
Phone Number
URL
15
16. APEX out of the box
Neuladen der Seite verhindern
Warnung bei ungespeicherten Änderungen
16
20. 20
PRETIUS Client Side Validation Plugin
Clientseitige Validierungen mit Plugins
Demo Time!
21. Clientseitige Validierungen mit Plugins
21
Pretius Client Side Validation Plugin
Schnelles Setup nur eine Dynamic Action (auf Seite 0) nötig
Ausführen von beliebigen Validierungen möglich
Jedoch serverseitig: JavaScript ruft Validierung in der Datenbank auf
Kein Submit nötig
Validierung findet jedoch auf der Server-Seite statt
Live Validation Plugin
Echte clientseitige Validierungen
Jedoch „nur“ auf Basis der HTML5 Validierungen
24. Parsley
Kann Submit unterdrücken
Einfache Validierungen über HTML-Attribute möglich
Komplexe Validierungen mit JavaScript Kombination mit Serverseitigen Validierungen
durch Abfrage von Seitenprozessen im JavaScript möglich
24
26. Json Form Validator
Guter Überblick über alle Validierungen
Features noch stark eingeschränkt
Lediglich HTML5 Features
26
27. Ausblick: JavaScript Validierungen in APEX
Item Plugin oder Dynamic Action Plugin
Zuordnung durch CSS-Klassen
Auf Global Page – 0 einbinden
27
28. Exkurs: Was kann der Client noch für Sie tun?
Automatische Datumsformatierung mit JavaScript
28
31. Fazit
Einfache Validierung: HTML5 oder APEX-Boardmittel
Komplexere Validierungen: JavaScript und DB im Zusammenspiel
Für bessere UX: Pretius Plugin
Client nicht zu stark belasten, Server aber auch nicht
31
32. Vielen Dank! Noch Fragen?
Vortragsbewertung: http://bit.ly/2oUfQR1
@sgrzbielok
xing.com/profile/Steven_Grzbielok
Hinweis der Redaktion
Fire on Initialization
Komplexere Validierungen wie Zahlenfelder, Emails etc. nicht clientseitig!