200 likes | 303 Views
XFORMS in minutes. Chris Bailey. Presentation overview. Introduction What & Why How XFORM works Code examples Specific features Problems & Issues References. <FORM> is dead – all hail the <XFORM>!. XForms offers a higher level approach to writing traditional XHTML form-based input.
E N D
XFORMS in minutes Chris Bailey
Presentation overview • Introduction • What & Why • How XFORM works • Code examples • Specific features • Problems & Issues • References
<FORM> is dead – all hail the <XFORM>! • XForms offers a higher level approach to writing traditional XHTML form-based input. • Became a W3C recommendation in 2003 • Second edition of the spec released in Sept 2006 • XForms WG currently working on 1.1
Why use Xforms? • Clearer design • Implements separation of concerns via a MVC approach • data model independent from presentation • ‘logic’ easier to code • Less code • No javascript! <script/> • Works with existing technologies… • Designed with AJAX in mind
Underpinning technologies • XML • XML Schema • XPath • DHTML • HTTP • Javascript • Ajax… What you (as the developer) need to know What the xform handling code uses
How to do I produce XFORMS? • XFORMS are all written in XML • When executedXFORMS (D)HTML+Javascript • Pre-compile source code • Dynamic compilation on server • Dynamic compilation on client (browser)
XFORM implementations • Pre-compilation • AJAXForms • XFormation • Server support • Orbeon • IBM Workplace Forms • Browser support • X-Smiles • Browser addons/extensions • Mozilla XForms • MozzIE • FormsPlayer • FormFaces
Quotes • “XForms is the most-implemented W3C specification ever at this stage in its life-cycle.” [W3C XForms FAQ] • British Government's e-government interoperability framework current guidance is to use the XForms standards as defined by W3C
XFORMS MVC Approach Model: Define the format of the data Controller: Specify constraints and relationships View: Simply reference parts of the model <patient> <title/> <sex/> <dob/> <children/> </patient>
XFORMS MVC Approach Model: Define the format of the data Controller: Specify constraints and relationships View: Simply reference parts of the model No empty nodes allowed String, max length 50 chars Enumeration (Male|Female) Date value Integer range{0 < x < 10} <patient> <title/> <sex/> <dob/> <children/> </patient>
XFORMS MVC Approach Model: Define the format of the data Controller: Specify constraints and relationships View: Simply reference parts of the model No empty nodes allowed String, max length 50 chars Enumeration (Male|Female) Date value Integer range{0 < x < 10} <patient> <title/> <sex/> <dob/> <children/> </patient>
Show me some XFORMs! Data model Control binding View <html> <head> <xforms:model> <xforms:instance> <person> <name/> </person> </xforms:instance> <xforms:bindnodeset="/person/name" type="xs:string" constraint=“string-length(.) < 50"/> </xforms:model> </head> <body> <p>Hello world. Please enter your name here: <xforms:inputref="/person/name“/></p> <body> </html>
Show me some XFORMs! Data model Control binding View <html> <head> <xforms:model> <xforms:instance> <person> <name/> </person> </xforms:instance> <xforms:bindnodeset="/person/name" type="xs:string" constraint=“string-length(.) < 50"/> </xforms:model> </head> <body> <p>Hello world. Please enter your name here: <xforms:inputref="/person/name“/></p> <body> </html>
Referencing data with XPATH • View and controllers reference data model with XPATH expressionse.g. <xforms:bindnodeset="…" required="true" /> /credit-card/number /credit-card/*[position() = 1] /credit-card/*[starts-with(local-name(),’expiration’)] /credit-card/*
Binding attributes (validation) • type<xforms:bindnodeset="/credit-card/expiration-month" type="xs:integer" /> • constraint<xforms:bindnodeset="/credit-card/expiration-month" constraint=". >= 1 and 12 >= ."/> • required<xforms:bindnodeset="/credit-card/expiration-month" required="true" />
Binding attributes (cont) • calculate<xforms:bindnodeset="/person/age" calculate="year-from-date (current-date()) - year-from-date(../dob)" /> • readonly<xforms:bindnodeset="/person/age" readonly="if (../dob == ‘’) then ‘false’ else ‘true’"/> • relevant<xforms:bindnodeset="/person/password" relevant="false"/>
View attributes <xforms:select1ref="/moving-details/my-delivery-company"appearance="…"> <xforms:itemsetnodeset="/companies/delivery"> <xforms:labelref="label"/> <xforms:valueref="@value"/> </xforms:itemset> </xforms:select1>
Disadvantages of XFORMS • Enhanced accessibility • The abstraction that xforms offers means that you need not worry so much about the presentation issues • Reduced accessibility • At the mercy of the xforms handler • Can AJAX ever be made accessible?
Did I mention it’s all XML? • OH MY GOSH IT’S ALL XML!!!!!! • Not for the faint hearted (or people without a CS degree!) • Editors should make this easier when they arrive • OpenOffice.org 2.0 already here
References • XForms 1.0 (Second Edition) W3C Recommendation 14 March 2006 • http://www.w3.org/TR/xforms/ • XForms 1.1 W3C Working Draft • http://www.w3.org/TR/xforms11/ • Orbeon Forms • http://www.orbeon.com/