XFORMS in minutes Chris Bailey Presentation overview • Introduction – What & Why • How XFORM works – Code examples – Specific features • Problems & Issues •

Download Report

Transcript XFORMS in minutes Chris Bailey Presentation overview • Introduction – What & Why • How XFORM works – Code examples – Specific features • Problems & Issues • 

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 executed
XFORMS
(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
Controller: Specify
constraints and relationships
Model: Define the
format of the data
<patient>
<title/>
<sex/>
<dob/>
<children/>
</patient>
View: Simply reference
parts of the model
XFORMS MVC Approach
Controller: Specify
constraints and relationships
No empty nodes allowed
String, max length 50 chars
Enumeration (Male|Female)
Model: Define the
format of the data
<patient>
<title/>
<sex/>
<dob/>
Date value
Integer range{0 < x < 10}
<children/>
</patient>
View: Simply reference
parts of the model
XFORMS MVC Approach
Controller: Specify
constraints and relationships
No empty nodes allowed
String, max length 50 chars
Enumeration (Male|Female)
Model: Define the
format of the data
<patient>
<title/>
<sex/>
<dob/>
Date value
Integer range{0 < x < 10}
<children/>
</patient>
View: Simply reference
parts of the model
Show me some XFORMs!
<html>
<head>
<xforms:model>
<xforms:instance>
<person>
<name/>
Data model
</person>
</xforms:instance>
Control
binding
<xforms:bind nodeset="/person/name" type="xs:string"
constraint=“string-length(.) < 50"/>
</xforms:model>
</head>
<body>
<p>Hello world. Please enter your name here:
View
<xforms:input ref="/person/name“/></p>
<body>
</html>
Show me some XFORMs!
<html>
<head>
<xforms:model>
<xforms:instance>
<person>
<name/>
Data model
</person>
</xforms:instance>
Control
binding
<xforms:bind nodeset="/person/name" type="xs:string"
constraint=“string-length(.) < 50"/>
</xforms:model>
</head>
<body>
<p>Hello world. Please enter your name here:
View
<xforms:input ref="/person/name“/></p>
<body>
</html>
Referencing data with XPATH
• View and controllers reference data model with
XPATH expressions
e.g.
<xforms:bind nodeset="…" required="true" />
/credit-card/number
/credit-card/*[position() = 1]
/credit-card/*[starts-with(local-name(),’expiration’)]
/credit-card/*
Binding attributes (validation)
• type
<xforms:bind nodeset="/credit-card/expiration-month" type="xs:integer" />
• constraint
<xforms:bind nodeset="/credit-card/expiration-month"
constraint=". >= 1 and 12 >= ."/>
• required
<xforms:bind nodeset="/credit-card/expiration-month" required="true" />
Binding attributes (cont)
• calculate
<xforms:bind nodeset="/person/age"
calculate="year-from-date (current-date()) - year-from-date(../dob)" />
• readonly
<xforms:bind nodeset="/person/age"
readonly="if (../dob == ‘’) then ‘false’ else ‘true’" />
• relevant
<xforms:bind nodeset="/person/password" relevant="false" />
View attributes
<xforms:select1 ref="/moving-details/my-delivery-company" appearance="…">
<xforms:itemset nodeset="/companies/delivery">
<xforms:label ref="label"/>
<xforms:value ref="@value"/>
</xforms:itemset>
</xforms:select1>
appearance="full"
appearance="compact"
appearance="minimal"
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/