I have currently finished a paper about XForms (and XFormsMM) for an univerity course called Adaptive User Interfaces. The paper gives a general introduction to XForms as well as to XFormsMM. XFormsMM is a (quite theoretical) approach how multi-modal forms can be build on top of XForms. It’s based on a paper of Mikko Honkala and Mikko Pohja and on the idea of extending XForms with modality-dependent style-sheets.
You can download the paper here. My own presentation about XForms can be found here.
I have used the following resources, which are also a good starting point to get some information about XForms:
- Mikko Honkala & Mikko Pohja, Multimodal Interaction with XForms: An approach as well as a reference implementation, which shows how mulit-modal applications can be build on top of XForms.
- Micah Dubinko, XForms Essentials: A great (and free!) book, that gives a good introduction to XForms. It was published by O’Reilly 2003.
- FormFaces: A small JavaScript framework to run XForms in your browser. It can be used “out of the box” without any installation. It’s running under BSD-licence.
To get started and to get an idea of what XForms is, I’ve made a small example using the FormFaces library:
The code is quite simple. First of all, you have to declare some namespaces for XForms itself and for the XML events XForms is using:
|
1 2 3 4 |
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:xf="http://www.w3.org/2002/xforms" xmlns:ev="http://www.w3.org/2001/xml-events" > |
After that, you have to include the FormFaces JavaScript library to your code:
|
1 |
<script type="text/javascript" src="formfaces.js"></script> |
Now you can declare an XML data-model to be modified with the form, e.g. from an XML file:
|
1 2 3 4 5 6 |
<xf:model id="model"> <xf:instance id="default" src="questionnaire.xml" /> <xf:submission omit-xml-declaration="true" action="/AUI_Example_Server/Submit.jsp" separator="&" method="post" enctype="text/xml" id="submit" /> <xf:bind nodeset="age" constraint="string(number(.)) != 'NaN'" /> <xf:bind nodeset="online" constraint="string(number(.)) != 'NaN'" /> </xf:model> |
The corresponding XML file looks like this:
|
1 2 3 4 5 6 7 8 9 10 |
<questionnaire xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="questionnaire.xsd"> <location></location> <age>123</age> <voice>false</voice> <touch>false</touch> <devices>0</devices> <online>0</online> </questionnaire> |
Now, you can write XForms controls to operate on this data-model. A simple control can look like this:
|
1 2 3 4 5 6 7 |
<b>How many houres are you online per day?</b> <xf:input ref="online"> <xf:label /> </xf:input> <xf:message level="modal" ev:event="xforms-invalid"> Please enter a valid periode! </xf:message> |
So, all together:
- The demo page (HTML + XForms + JavaScript)
- The example data model (XML)
- FormFaces library @ Sourceforge.com
- My paper (PDF)
- My presentation (PDF)
Best regards, Thomas Uhrig.