1 / 33

XForms

XForms. Von Matthias Keck. Übersicht. 1. Motivation 2. Aufbau von XForms model user interface 3. form controls und binden 4. data types und functions 5. actions und events 6. Ausblick. Was ist XForms?. XForms ermöglicht plattform- und geräteunabhängige Formulare

brandi
Télécharger la présentation

XForms

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. XForms Von Matthias Keck

  2. Übersicht 1. Motivation 2. Aufbau von XForms • model • user interface 3. form controls und binden 4. data types und functions 5. actions und events 6. Ausblick

  3. Was ist XForms? • XForms ermöglicht plattform- und geräteunabhängige Formulare • XForms ist kein eigener Dokumententyp  Einbindung in beliebige XML- Dokumente • XForms ist der Nachfolger von HTML- form und wird dieses in XHTML 2.0 ersetzen • Aktuelle Version: XForms 1.0 (W3C Recommendation 14.10.2003)

  4. Vorteile von XForms • Trennung der Darstellung von Daten und Logik • Daten werden in XML gesammelt und als XML- Dokument gesendet • Unterstützt Berechnungen und Validierung  man braucht weniger/keine Scripte weniger Arbeit für Server

  5. Aufbau von XForms 1. Deklariere Daten(-logik) und Übertragungsart in <model> 2. Benutze XForms Controls (<input>, <submit>,…) 3. Binde XForms Controls an in <model> deklarierte Elemente

  6. Aufbau in XHTML <h:html xmlns:h="http://www.w3.org/1999/xhtml" xmlns="http://www.w3.org/2002/xforms"> <h:head> <h:title>Search</h:title> <model> <submission action="http://example.com/search" method="get" id="s"/> </model> </h:head> <h:body> <h:p> <input ref="q"> <label>Find</label> </input> <submit submission="s"> <label>Go</label> </submit> </h:p> </h:body> </h:html>

  7. Ansicht in XSmiles

  8. XForms Core Attribute • ID: Weist Element eine ID zu • src: Fügt unter URI angegebene Ressource ein

  9. Wichtige Elemente - model • In <model> werden die zu sammelnden Daten beschrieben • Beliebig viele model- Elemente in einem Dokument  Auswahl über Attribut ID

  10. Wichtige Elemente - instance • Optionales Element • Enthält vorgegebene Werte für bestimmte Elemente (oder eine Referenz darauf)

  11. Wichtige Elemente - submission • Gibt an wohin und wie die Daten gesendet werden sollen • Mindestens 2 Attribute notwendig • action: Ziel des Übertragung • method: Übertragungsart (z.B. put, post, get…)

  12. Beispiel: model <model> <instance> <person> <fname>Ein_Vorname</fname> <lname/> </person> </instance> <submission id="form1" action="submit.asp" method="get"/> </model>

  13. XFormsControls • input Eingabefeld • textarea großes Eingabefeld • secret Eingabefeld für Passwörter • select1 Auswahl genau eines Elements • select Auswahl von Elementen • range Schieberegler • upload Öffnet Auswahlfenster zum Upload • trigger Startet eine Aktion • submit Übertrage Daten • output Zeige gesammelte Daten

  14. Attribute für XForms Controls • Das Erscheinungsbild jedes XForms Controls lässt sich über das Attribut appearance in drei Stufen variieren. • full • compact • minimal Beispiel in XSmile

  15. <person> <name> <fname/> <lname/> </name> </person> / /person /person/name /person/name/fname name/lname Binden: XPath Mit „/“ absolut von root aus, ohne „/“ relativ

  16. <instance> <person> <name> <fname/> <lname/> </name> </person> </instance> <input ref="name/fname"> <label>First Name </label> </input> <input ref="name/lname"> <label>Last Name </label> </input> Binden mit ref In <model> Im user interface

  17. <model> …… <bind nodeset= "/person/name/fname" id="firstname"/> <bind nodeset= "/person/name/lname" id="lastname"/> </model> <input bind="firstname"> <label> First Name </label> </input> <input bind="lastname"> <label>Last Name </label> </input> Binden mit bind In <model> Im user interface

  18. Beispiel: user interface <model> ….</model> <input ref="fname"> <label>First Name</label> </input> <br /> <input ref="lname"> <label>Last Name</label> </input> <br /> <submit submission="form1"> <label>Submit</label> </submit> model

  19. Beispiel: model <model> <instance> <person> <fname>Ein_Vorname</fname> <lname/> </person> </instance> <submission id="form1" action="submit.asp" method="get"/> </model>

  20. <html xmlns:xf= "http://www.w3.org/2002/ xforms" xmlns:xsd= "http://www.w3.org/2001/ XMLSchema" xmlns:xsi= "http://www.w3.org/2001/ XMLSchema-instance"> <xf:instance> <person xmlns=""> <fname xsi:type="xsd:string"/> <lname xsi:type="xsd:string"/> <born xsi:type="xsd:date>"/> <size xsi:type="xsd:integer"/> </person> </xf:instance> XForms data types mit XML Schema

  21. Alternative Möglichkeit Einem Element kann mit bind ein Typ zugewiesen werden <xf:bind nodeset="/person/size" type="xsd:integer"/> Beispiel in XSmile

  22. XPath Funktionen • if(booleantest, string1, string2) • avg(node-set) • min(node-set) • max(node-set) • count-non-empty(node-set) • now() • starts-with() • …

  23. XPath Funktionen <werte> <a>2</a> <b>1</b> <c>10</c> <d>5</d> </werte> Beispiel: max(werte) = 10 Oder auch: a+b, a-b, a/b, a*b, a or b, a div b…. Beispiel in XSmile

  24. actions and events • Aktionen (actions) werden durch Ereignisse (events) gestartet. Beispiel: <setvalue bind="frequency" ev:event="xforms-ready"> 0 </setvalue>

  25. XForms events DOMActivate DOMFocusIn/DOMFocusOut xforms-ready xforms-model-construct-done xforms-model-destruct xforms-help/xforms-hint xforms-reset xforms-submit

  26. XForms events xforms-value-changed xforms-select / xforms-deselect xforms-valid / xforms-invalid xforms-readonly / xforms-readwrite xforms-required / xforms-optional xforms-enabled / xforms-disabled xforms-out-of-range / xforms-in-range xforms-submit-done

  27. XForms actions message: Zeigt eine Nachricht an setvalue: Setzt ein Element auf einen Wert setfocus: Fokussiert ein form control send: Startet submission reset: Löscht alle eingegebenen Daten load: Lädt eine URL

  28. XForms actions toggle: Wechselt zu anderem case insert: Fügt neues Element ein delete: Löscht Element setindex: Setzt den Index von repeat dispatch: Leitet (veränderte) events weiter action: Ruft (mehrere) andere actions auf

  29. switch - case <model> <toggle ev:event="xforms-ready" case="go"> ... </model> <switch> <case id="default_message">You are using a browser that doesn't support XForms</case> <case id="go">...</case> </switch> Beispiel in XSmile

  30. switch - case

  31. Implementierungen • X-Smiles, open source Java-basierter XML Browser der Helsinki University of Technology. • FormsPlayer, XForms processor plug-in für Internet Explorer 6 SP 1. • Novell XForms, Java Application. • Für Mozilla in Bearbeitung

  32. Quellen • XForms 1.0 Recommendation Errata (http://www.w3.org/2003/10/REC-xforms-10-20031014-errata.html) • XForms Essentials (http://xformsinstitute.com/essentials/ browse/book.php)

  33. Vielen Dank

More Related