Real-world XForms Micah Dubinko Chief XML Architect July 2004.

Real-world XForms

Micah DubinkoChief XML Architect

July 2004

©2004 Verity, Inc. 2

For Starters…

• Who am I?• Why am I here?• Who do I represent? (hint: not my employer here)• How did I get here?• What is the meaning of life? (advanced topic)

• Be sure to consult the handout frequently


Agenda

• The Basics:• The good: XPath• The bad: Namespaces• The ugly: XML Schema

• What XForms Adds to the Picture• A step back—intentional markup• Repeating and dynamic strucutres• REST and submit options

• Deployment Strategy• Gotchas


Proprietary vs. Open Standards

• Proprietary Standard • Typically owned by a corporation.• The owner, who can change it at will, licenses its use

and typically prevents inspection of internal code.• Open Standard

• A published standard that can be used by all.• It is managed by a standards organization, which

oversees its dissemination and evolution.• The primary standard-setting group for the Internet is

the World Wide Web Consortium (W3C).

Based on the second quarter of fiscal 2004


Standards Continuum

0

10

20

30

40

50

60

0 1 2 3 4 5

•Standards-based•Partial•Proprietary


Disadvantages of Proprietary Technology

• Closed (even partially) solutions run the following risks:

• Reduce or eliminate future flexibility• Huge costs associated with change-out• Increased costs for compatibility and connectivity• Incompatibility with other packages due to lack of

standards


The Future of an Open Approach

–The World Wide Web is overwhelmingly standards-driven

•http://...

•…/index.html

•URL

•TCP/IP

•Email

–Open standards ensure that products will improve -- not only in quality but also in cost

–Open standards provides new forms of cooperative communication and exchange that can both standardize and energize an entire industry

ExampleEarly adoption of a

single, open digital cell phone standard drove

rapid use in Europe that has far exceeded that of

the United States. Equipment

manufacturers only have one set of

specifications to address, services such as messaging and two-way data transfer are being offered much

faster and much more comprehensively than in

the U.S.


<XML>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><?xml-stylesheet href="screen.css" type="text/css" media="screen"?><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <title>Virtual Library</title> </head> <body> <p>Moved to <a href="http://vlib.example.org/">v.e.org</a>. </p> </body></html>

• XML is a labeled tree• You can think of it as syntax…


</XML>

• You can think of it as a data structure…


Why XPath?

• Query language for XML• Light weight (all things considered)• Part of XSLT, XForms and XML Signature

• Reading XPath Expressions out loud• p (“all child p elements”)• p/span (“all span grandchild elements of p

child elements”)• p/* (“all grandchild elements (of any name) of

p child elements”)


XPath 101

/html/head/titlehtml:head/xforms:model/@xml:id../itemspurchaseOrder/items/item[3]purchaseOrder/items/item[@price = 12.34]string-length('hello world')purchaseOrder/subtotal * instance('taxtable')/tax

• Consider these XPath expressions:• What do they do?• Absolute or relative?• What kind of XML are they expected to operate

over?• Which one has no dependency on any particular

XML?


XPath Datatypes

• String• Number (IEEE, including INF, -INF, and NaN)• Boolean• Node-set

• Automatic conversions as needed


Getting Selective

• Predicates filter node-sets, by performing a test on each node in a node-set

• a (selects all <a> child elements)• a[@href= “http:…”] (selects all <p> children IF …)

A numeric predicate matches the nth nodep[4] is the same as p[position() = 4]

A node-set predicate matches if the node-set is not empty

A boolean predicate matches the node if true()Multiple predicates are allowed.


Axes to Grind

• Other search directions than parent->child are possible

• child, attribute, parent, descendant, descendant-or-self, ancestor, ancestor-or-self, following, following-sibling, preceding, preceding-sibling, namespace

• Example:/html/head/following-sibling::body/attribute::id

Every axis has a principal node type: ofElement | Attribute | Namespace


Abbreviations and Corner Cases

• The default axis is child::• @ is an abbreviation for the attribute axis• * selects any node of the ‘principal node type’• . (dot) means self::node( )• .. (dot dot) means parent::node( )• // (slash slash) means /descendant-or-self::node(

)/

• node() selects any node except attributes or root• text() selects any text node• comment() selects any comment node• processing-instruction()… you get the picture


Common Mistake 1

• Q:What does this expression select?• //p[1]

• Wrong answer: “the first p element in the document”

• It expands to /descendant-or-self::node( )/p[1]• (‘every first p element child of any node’)

• You probably wanted this:• (//p)[1]


Common Mistake 2

• What does this select?• ancestor::lineitem[3]

• Wrong answer: “The third ancestor lineitem element”

• position() is counted backwards for the reverse axes• (ancestor, ancestor-or-self, preceding, preceding-sibling)

• Right answer: “The third-from-last ancestor lineitem element”


Common Mistake 3

• Here’s some XML:<html xmlns=“whatever”><head> <title>oops</title></head></html>

What does this select?/html/head/title

Answer: NOTHING – an empty node-set(You really need a prefix mapped, say ‘h’, and then/h:html/h:head/h:title)


Function Libraries and Operators

• Much like a scripting language, XPath has a useful function library:

• Example: position(); count(); id(); concat(); starts-with(); contains(); substring(); string-length(); not(); true(); false(); sum(); floor(); ceiling()

• Operators too:• or; and; =; !=; <=; <; >=; >; +; -; *; div;

mod; (unary) -; | (union)


Now you know…

/html/head/titlehtml:head/xforms:model/@xml:id../itemspurchaseOrder/items/item[3]purchaseOrder/items/item[@price = 12.34]string-length('hello world')purchaseOrder/subtotal * instance('taxtable')/tax

• Consider these XPath expressions:• What do they do?• Absolute or relative?• What kind of XML are they expected to operate

over?• Which one has no dependency on any particular

XML?


For more on XPath…

• Consult this excellent written work:

• (Chapter 3)

•Or read it online for free:• http://xformsinstitute.co

m/

•Use the source• http://www.w3.org/TR/xpa

th


Namespaces: added complexity

• Namespaces are a notoriously complicated part of XML• These are equivalent:

• <someElement xmlns=“someurl”/>• <p:someElement xmlns:p=“someurl”/>

• This is not:• <someElement/>

• Prefix is (largely) irrelevent. What matters is the URL• URL is not (generally) ever accessed, despite the

common “http://”. Just a unique, persistent identifier


XML Schema

• Type system based on restriction:• minLength, maxLength• min/max Inclusive/Exclusive• enumeration• length• fractionDigits, totalDigits• pattern, whiteSpace

• Lists and Unions also possible• Regex commonly used:

• [0-9]{5}(-[0-9]{4})? For US Zip code• XForms can key off of certain datatypes, like

date

Break

Caffeine time…


A Step Backwards

• What does it mean to write an XForms document?

<input ref=“q”> <label><html:img src=“google.jpg” alt=“Google” /></label> <send ev:event=“DOMActivate” submission=“f” /></input>

<trigger> <label>I Feel Lucky</label> <setvalue ev:event=“DOMActivate” ref=“btnl”>true</setvalue> <send ev:event=“DOMActivate” submission=“f” /></trigger>• Markup captures author intent.

• User Agent interprets author intent• (back to the original goal of HTML!)


Intentional Actions

• XForms Actions concisely indicate author intent• This is A Good Thing, even if script is involved

• Examples:• <setfocus>• <setvalue>• <load> (follow a URL, in the same or new window)• <send> (submit the form)• <message> (indicate something to the user)

• Modal, modeless, or ephemeral• <insert> (add a new repeating item)


Intentional Form Controls

• Form controls indicate the, you guessed it, intent…

• Examples:• input, textarea, secret, output• range, select, select1• trigger, submit• upload

• Even sub-elements and attributes are intentional:• label, help, hint, alert• @incremental• @appearance (full, compact, or minimal)• @inputmode


Dynamic User Interface

• Swich/case for one-at-a-time alternates (e.g. ‘pages’)<switch> <case id=“default”>Not Initialized</case> <case id=“ready”>Initialized</case></switch>… <toggle ev:event=“xforms-ready” case=“ready” />

• Repeat for things like line items, or list choices<repeat nodeset=“bookmark”/> <input ref=“bk_title”><label>Title</label></input> <input ref= “bk_url”><label>URL</label></input></repeat>


Getting down to the data

• The <model> is the heart (and brain) of the form:<model id=“query”> <submission action=“http:…” id=“f” /> <bind nodeset= “q” required=“1” /></model>

• Model Item Properties define data characteristics:• readOnly, required, relevant (XPath)• calculate, constaint (XPath)• type, p3ptype


Hooking Up to the Data

• Say the XML looks like this:<instance> <query ie=“UTF-8” xmlns=“”>  <q>search terms</q> <lucky>false</lucky> </query></instance>

• Then the form controls can bind to it like this:<select1 ref=“@ie” …<input ref=“q” …<select1 ref=“/query/lucky” …

• XPath strikes again


More details on binding

• ID/IDREF can simplify binding:<bind id=“mybind” nodeset=“xpath” required=“1”/> ∆ ∆ ∆ <input bind=“mybind”…

• Multiple Models, Multiple instances possible<input ref=“email” model=“m1” …<input ref=“pollq” model=“m2” …<input ref=“instance(‘hidden’)/sessionid” …


GET vs. POST, a REST-side story

• What does a URL like this really mean?http://www.google.com/search?q=xforms&ie=UTF-8

• You can think of it as a mapping of URL-space• Always use GET unless:

• The form has a huge amount of data• Submitting the form causes a significant

obligation(like purchasing something)

• Form data is sensitive enough that it shouldn’t appear in server logs, or the location bar


PUT, the forgotten verb

• If you are designing a REST-like architecture, consider using HTTP to implement form submission that creates or updates a web resource

• PUT also applies in concept to the file system, when submitting the form creates or updates a local file

<submission method=“put” action=“http:…” />


Submission Data Formats

• application/x-www-form-urlencoded (for GET)• application/xml (yep, it’s XML)

• All data is UTF-8 encoded, so “Ünited Stätes”becomes “%C3%9Cnited+St%C3%A4tes”

• multipart/form-data (every leaf node becomes a part)

• multipart/related (main XML becomes one part, binary attachments become other parts)


Example of multipart/related

Content-Type: multipart/related; boundary=a42113842b; type=application/xml;

start="<[email protected]>" Content-Length: 65232--f93dcbA3 Content-Type: application/xml; charset=UTF-8Content-ID: [email protected]<?xml version="1.0"?><root_element> <name>Cordova Cassanova</name> <picture>cid:[email protected]</picture> </root_element>--a42113842bContent-Type: image/jpgContent-Transfer-Encoding: binaryContent-ID: [email protected] image data...--a42113842b--


Deployment Strategies

• The old way: Write JS on client, Perl on Server• Never trust that the client isn’t a 8-year old w/

telnet• With XForms, you can write one XForms Model,

shared between client and server• Less CGI hacks == better security


Server-side XForms

• Transforms XForms into something digestible by modern browsers

• Can be “split out” in various ways, with differences on how much “round-tripping” is needed

• Leading Contenders:• Chiba http://chiba.sourceforge.net• IBM XML Forms Package

(http://alphaworks.ibm.com/tech/xmlforms)• Orbeon OXF (http://www.orbeon.com/oxf)• Many more than I can keep track of…


Client-side XForms

• Application or browser-addition to process XForms• Leading Contenders:

• x-port FormsPlayer (http://www.formsplayer.com)• X-Smiles (http://www.x-smiles.org)• Oracle Mobile Browser

(otn.oracle.com/tech/wireless/mobilebrowser.htm)• Novell XForms Technology Preview

(http://developer.novell.com/xforms)• DENG (http://claus.packts.net) in Flash• Many more than I can keep track of…


Examples: XF Institute entry quiz

• <xf:model> <xf:instance> <root xmlns="http://example.info"> <noop></noop> <value></value> </root> </xf:instance></xf:model>…<xf:textarea ref="/my:root/my:noop“><xf:label>Write your answer here</xf:label></xf:textarea>

<xf:trigger><xf:label>Reveal Answer</xf:label> <xf:setvalue ev:event="click" ref="/my:root/my:value> … <xf:setvalue></xf:trigger>

<xf:textarea ref="/my:root/my:value"><xf:label>Answer</xf:label></xf:textarea>


Examples: XF Institute multi-choice

• <xf:model> <xf:instance> <inst-data xmlns=""> <resp1></resp1> <resp2></resp2> <a1 ans="calculate='../price * ../quantity'">Correct!</a1> <a1 ans="constraint='../price * ../quantity'">Wrong</a1> <a1 ans="calculate='price * quantity'">Sorry</a1> <a1 ans="constraint='price * quantity'">Oops</a1> <a2 ans="XML Schema datatypes">No</a2> <a2 ans="HTML links">Try again</a2> <a2 ans="XPath nodes">Correct!</a2> <a2 ans="P3P datatypes">Sorry</a2> </inst-data> </xf:instance></xf:model>


Examples: XF Institute multi-choice

• <xf:select1 appearance="full" ref="resp1"> <xf:label>Which statement correctly calculates price times quantity from a line item?</xf:label> <xf:itemset nodeset="/inst-data/a1"> <xf:label ref="@ans"/> <xf:value ref="text()"/> </xf:itemset></xf:select1> <xf:output ref="resp1"/>




XPath vs. Common Authoring Errors

• As an author, I used to get many emails – “here’s my XForms markup, why doesn’t it work?”

• In response, I collected common authoring errors, and wrote a validator to detect them

• http://xformsinstitute.com/validator/

• Most problems are namespace-related• Detection solutions are XPath-based• Draw your own conclusions from these data


Gotcha #1, missing the ns switch

• Example:<html xmlns= http://www.w3.org/1999/xhtml> <head> <model>… 

• Detector://*[local-name(.)=‘model’ or local-name(.)=‘instance’or …several others element name checks…][namespace-uri(.)=namespace-uri(/*) andnamespace-uri(.)!=$xfns]


Gotcha #2, missing ns switch back

• Example:<model> <instance> <myelem> …. 

• Detector://xf:instance/*[namespace-uri(.)=namespace-uri(/*) or namespace-uri(.)=$xfns]


Gotcha #3, obsolete event names

• Example:<send ev:event=“click” …>

• Detector://xf:*[@ev:event=‘click’ or @ev:event=‘xforms-activate’ or @ev:event=‘xforms-value-changing’]


Gotcha #4, nodesets in disguise

• Example:<bind nodeset= “foo” required= “true” />

• Detector://xf:bind[@readonly= ‘true’ or @readonly= ‘false’ or@required= ‘true’ or @required= ‘false’ or@relevant= ‘true’ or @relevant= ‘false]


Other features of the Validator

• Detection and appropriate handling of older CR namespace (soon to be removed)

• Manual ID->IDREF checking (whether or not IDs are properly DTD-defined)

• Extraction and individual Relax NG validation of ‘islands’ of XML content.• An ‘island’ element has

• The XForms namespace• No ancestors with the XForms namespace

• Some interest in intranet installs of the Validator, email me…


For More Information

• [email protected]

• http://xformsinstitute.com• http://xformsinstitute.com/validator/• http://xformsinstitute.com/essentials/

• http://dubinko.info/blog/

Real-world XForms Micah Dubinko Chief XML Architect July 2004.

Documents