XForms

From Wikibooks, the open-content textbooks collection

Jump to: navigation, search
Featured book en.svg

XForms is a featured book on Wikibooks because it contains substantial content, it is well-formatted, and the Wikibooks community has decided to feature it on the main page or in other places. Please continue to improve it and thanks for the great work so far! You can edit its advertisement template.


Contents

[edit] XForms Tutorial and Cookbook

Welcome to the XForms Tutorial and Cookbook Wikibook! XForms is a World Wide Web Consortium recommendation for creating web forms and web applications. XForms is easy to learn, provides a rich user experience and does not require you to learn JavaScript.

This is a collaborative project and we encourage everyone who is using XForms to contribute their complete working XForms examples. All example programs must conform to the creative-commons-2.5 share-alike with attribution license agreement [1].

Note: We have restructured the main page to make it easier to classify your examples. Note for example that now all the search examples have been grouped together. The "Next Page" links have not yet been updated.

  1. Instructors: please sign our Guest Registry if you are using this book for learning or teaching XForms.
  2. Contributors: please see our Naming Conventions to ensure your examples are consistent with the textbook.
  3. If you are looking for a specific example program, please feel free to use the Examples Wanted section.

If you feel these examples are useful please create links to this site. This book has over 30 contributors.

A French version can be found here of this XForms tutorial

Recent Changes Google Code Version Control System Book Statistics Related Wikibooks: XQuery XForms/REST/XQuery

Note: Almost all of the examples have been tested with the FireFox 2.0 XForms addon and the newer 0.8.6ff3 FireFox 3.0 addon. Please let us know if you find any errors.

[edit] Cover

[edit] Introduction

  1. Introduction - About this book and overview of the technology. Development stage: 100% (as of Sept 27th, 2006)
  2. Background - A brief history and motivation for the XForms standard. Development stage: 100% (as of Sept 27th, 2006)
  3. Benefits - Why use XForms? Development stage: 100% (as of Sept 27th, 2006)
  4. Installing and Testing - How to install an XForm plug-in or extension. Development stage: 100% (as of Sept 27th, 2006)
  5. Naming Conventions - Naming standards used throughout this book. Development stage: 100% (as of March 17th, 2006)
  6. XForms by Example - Short example to test your installation and get you started. Development stage: 100% (as of Sept 27th, 2006)

[edit] Beginning Examples

These examples are for people who are just getting started.

  1. HelloWorld - A simple test to see if XForms is installed correctly. Development stage: 100% (as of Sept 6th, 2006)
  2. Simple Message - Open a panel with a message Development stage: 100% (as of Sept 13th, 2006)
  3. XForms Architecture - An introduction to the XForms MVC architecture Development stage: 100% (as of March 17th, 2007)
  4. Input Example - A simple input that updates the model Development stage: 100% (as of Sept 13th, 2006)
  5. Incremental Many to One - How a single input field can change many output controls Development stage: 100% (as of Sept 13th, 2006)
  6. Spreadsheet like updating - how XForms tracks what fields need to be updated Development stage: 100% (as of Sept 6th, 2006)
  7. Bind - how to bind inputs to the model using the bind element Development stage: 100% (as of Sept 6th, 2006)
  8. Adder - sample XForm that uses a remote web service to sum two numbers Development stage: 100% (as of Aug 6th, 2007)

[edit] Form Input Controls

  1. Input - a simple input form with a label Development stage: 100% (as of Sept 6th, 2006)
  2. Address - a simple address form with labels Development stage: 100% (as of Sept 20th, 2006)
  3. Address Aligned - using CSS to align fields Development stage: 100% (as of Sept 20th, 2006)
  4. Input Field Width - using CSS to control field width Development stage: 100% (as of Oct 23rd, 2006)
  5. Secret - a way to enter passwords Development stage: 100% (as of Sept 27th, 2006) XForms-best-practice.jpg
  6. Message Types - three types of messages Development stage: 100% (as of Sept 6th, 2006)
  7. Textarea - a large block of text Development stage: 100% (as of Sept 6th, 2006)
  8. Textarea with style - styling textarea using CSS Development stage: 100% (as of Jan 19th, 2007) XForms-best-practice.jpg
  9. Checkbox - a simple boolean (yes/no) checkbox Development stage: 100% (as of Sept 14th, 2007)
  10. Selecting Items from Lists
    1. Select1 - the new radio button Development stage: 100% (as of Sept 6th, 2006)
    2. Select1 drop list - select a single option from a drop-down list Development stage: 100% (as of Sept 6th, 2006)
    3. Open Selection - suggests a value or allows the user to add their own Development stage: 100% (as of Aug 12th, 2007)
    4. Select - selecting many (check-boxes) Development stage: 100% (as of Sept 15th, 2006)
    5. Select Multi-Column - selecting many items from many columns (check-boxes) Development stage: 100% (as of Dec 29th, 2006)
    6. Select1 Multi-Column - selecting one item from many columns (radio buttons) Development stage: 100% (as of Dec 29th, 2006)
    7. Selecting from Model - getting data for select lists from the model Development stage: 100% (as of Sept 26th, 2006)
    8. Selecting from File - getting data for select lists from an external file Development stage: 100% (as of Sept 26th, 2006) XForms-best-practice.jpg
  11. Working with Dates
    1. Selecting a Date - using the bind command to present a calendar selector Development stage: 75% (as of Sept 12th, 2006)
    2. Formatting a date - display a date in MM/DD/YYYY format Development stage: 100% (as of Sept 13th, 2006) XForms-best-practice.jpg
  12. Upload - uploading a file from a local file system Development stage: 50% (as of Sept 6th, 2006)
  13. Trigger - the new button Development stage: 100% (as of Sept 6th, 2006)
    1. Controlling Button Appearance - setting button labels, hints and using images Development stage: 100% (as of Sept 6th, 2006)
  14. Range - adding a slider to your form Development stage: 100% (as of Sept 27th, 2006)
  15. Send - send out a request for a new resource Development stage: 25% (as of October 14th, 2009)
  16. Load - dynamically loading additional resources into your form Development stage: 25% (as of October 14th, 2009)

[edit] Client-Side Field Validation

  1. Validation with Bind - use a bind expression to set a data type and alert the user Development stage: 50% (as of October 14th, 2009)
  2. Case Validation - use a bind expression to check the case of an field Development stage: 50% (as of October 14th, 2009)

[edit] Submitting Data

  1. Submit - saving your XML data to a file or web server Development stage: 25% (as of Sept 6th, 2006)
  2. Encoding Parameters - encoding submission parameters Development stage: 25% (as of Sept 6th, 2006)
  3. Changing Namespaces in Submission - changeing the namespace prefixes from submission data Development stage: 50% (as of October 23th, 2009)

[edit] Events and Condition

  1. Events Overview - What are XForms events and how to use them Development stage: 25% (as of Dec 29th, 2008)
  2. Setting Initial Cursor - setting the initial cursor position when a form loads Development stage: 75% (as of Jan 7th, 2008)
  3. Selection and Deselection Events - Logging events when tabs are selected or deselected Development stage: 25% (as of April 1st, 2009)
  4. Conditional Actions

[edit] Output

  1. Binds to many instances - binding to many instances in many models Development stage: 50% (as of Sept 20th, 2006)
  2. Bind to ranges - binding to two different ranges Development stage: 75% (as of Sept 20th, 2006)
  3. Repeat - using repeat to display lists Development stage: 75% (as of Sept 20th, 2006)
  4. Conditional Styling - using CSS and group to conditionally display items in a list Development stage: 75% (as of Feb 26th, 2008)
  5. Formatting Numbers - how to format numbers and currency Development stage: 25% (as of Feb 26th, 2009)
  6. Output and Links - how to display links in your output Development stage: 75% (as of Feb 26th, 2008)

[edit] Dynamic Forms

Forms that change as you use them. Dynamic forms without using Javascript Development stage: 75% (as of Sept 6th, 2006)

  1. Switch and Case - swapping views with switch and case Development stage: 25% (as of Nov. 7th, 2006)
  2. Relevant - displaying only relevant fields Development stage: 00% (as of Sept 6th, 2006)
  3. Show-Hide Controls - hiding large controls Development stage: 25% (as of July 12th, 2009)
  4. Disable Buttons - how to disable buttons when they are not relevant Development stage: 25% (as of Sept 24th, 2007)
  5. Read Only - setting input fields to be read only Development stage: 100% (as of Sept 6th, 2006)
  6. Select and Group - using select to conditionally display a group Development stage: 100% (as of Nov 8th, 2006)
  7. Dynamic Labels - dynamically change the labels of a form without reloading the page Development stage: 75% (as of Sept 21st, 2007)
  8. Suggesting Items - creating a list of suggested items as you type Development stage: 75% (as of January 21st, 2008)
  9. Dynamic Selection Lists - itemset's that are dynamically dependent on values of an xml-instance Development stage: 75% (as of March 6th, 2008)
  10. Incremental Model Loading - dynamically loading other models Development stage: 25% (as of April 2nd, 2000)

[edit] Search Forms

  1. Search Form - creating a search form Development stage: 75% (as of Jan 13th, 2008)
  2. Search with Load - creating a search form with the load element Development stage: 75% (as of October 15th, 2009)
  3. Advanced Search - a search screen with simple and advanced tabs Development stage: 25% (as of Jan 13th, 2009)
  4. Search flickr - search flickr using REST interface Development stage: 100% (as of Sept 6th, 2006)
  5. Web service - calling a web service from within an XForm Development stage: 75% (as of Oct 5th, 2006)
  6. Stock Quote - Calling a REST service that returns stock information from a ticker symbol Development stage: 25% (as of Nov 9th, 2006)
  7. Search Amazon - Search amazon using a web service Development stage: 100% (as of Oct 18th, 2006)

[edit] Larger Examples

  1. Rich Text Editor - allow users to add markup using a WYSIWYG editor Development stage: 25% (as of October 16th, 2008)
  2. Slideshow - changing images in a slideshow Development stage: 75% (as of January 21st, 2008)
  3. Referencing Items - referencing items in sets Development stage: 75% (as of February 25th, 2008)
  4. Deep Copy with Insert Origin - using insert origin to perform a deep copy between instances in a model Development stage: 75% (as of March 6tht, 2008)
  5. A Trigger for Inserting BBcode into a Textarea box
  6. Multiple model comparison - comparing data from multiple models in XPath

[edit] Navigating Large Forms

Using Tabs and Trees - navigation of complex form data Development stage: 00% (as of Sept 6th, 2006)

  1. Horizontal File Tab Menu - a complete working example with no Javascript Development stage: 100% (as of Sept 6th, 2006) XForms-best-practice.jpg
  2. Horizontal File Tab Menu Highlighted - Tab menu with selected tab highlighted using CSS target Development stage: 100% (as of Sept 6th, 2006) XForms-best-practice.jpg
  3. Vertical Menu - Menu similar to prior version but using vertical orientation Development stage: 100% (as of Sept 6th, 2006)
  4. Folding Menus - Folding menus
  5. Tree Menus - Hierarchical Tree Menus Development stage: 25% (as of March 18th, 2009)
  6. Deselect Events - Catching the Deselection Events when you navigate away from a form
  7. Horizontal File Tab Menu Highlighted With Binding - Another Horizontal File Tab Menu using an Instance, Binding, Events and CSS Development stage: 100% (as of Jan 6th, 2009)
  8. Hierarchical Bookmarks - editing bookmarks Development stage: 100% (as of Sept 6th, 2006)
  9. Outline Editor - outline with indenting Development stage: 25% (as of Feb 5th, 2007)

[edit] Reading and writing to files

  1. Read and write with get and put - using the submission element to read and write a static Development stage: 75% (as of Sept 27th, 2006)
  2. Saving Intermediate Form Data - saving intermediate form data to a local drive Development stage: 25% (as of Sept 27th, 2006)

[edit] Composite Controls

Controls that combine controls

  1. Tri-Document Loading - three ways to upload a document Development stage: 25% (as of July 6th, 2009)
  2. Entity Selection - ways to select a person or organization Development stage: 25% (as of July 7th, 2009)

[edit] Tabular and Repeating Data

  1. Repeat into table - putting data into HTML tables Development stage: 25% (as of Sept 27th, 2006)
  2. Repeat filter - dynamically filtering out rows from lists Development stage: 50% (as of Aug 23rd, 2007)
  3. Inline Repeats - add structures horizontally to the right Development stage: 100% (as of Feb 24th, 2008)
  4. Insert - inserting a new row into a tabular structure Development stage: 100% (as of Sept 20th, 2006)
  5. Insert with Origin - inserting new data and specifying initial values using the origin attribute Development stage: 75% (as of Feb 27th, 2008)
  6. Delete - delete the selected row from a tabular structure Development stage: 100% (as of Sept 20th, 2006)
    1. Disable Trigger - disable the delete button when only a single item remains Development stage: 50% (as of Oct 22th, 2007)
    2. Delete Confirm - confirming before you delete Development stage: 25% (as of Sept 20th, 2006)
    3. Delete Confirm with CSS - Styling your confirmation with CSS Development stage: 75% (as of March 20th, 2007)
    4. Trailing Insert and Delete - add and delete from the end of a list Development stage: 100% (as of Sept 27th, 2006)
    5. Insert and Delete into Table - insert and delete rows into a table Development stage: 100% (as of Nov 4th, 2007)
  7. Highlight Selected Row - highlight a selected row Development stage: 50% (as of Sept 27th, 2006)
  8. Table Column Total - table with a column total in table footer Development stage: 100% (as of Dec 6th, 2006)

[edit] Advanced Topics

[edit] XML Schema

  1. Load from XML Schema - load data types from an external XML Schema file Development stage: 75% (as of Oct 9th, 2006)
  2. Validate - validate form using XML Schema Development stage: 25% (as of Oct 9th, 2006)
  3. Validate with schema types - validate form using XML Schema types Development stage: 75% (as of Oct 30th, 2006)
  4. Facet Validation - check min and max lengths of fields from the XML Schema Development stage: 75% (as of Oct 10th, 2006)

[edit] JavaScript

  1. Dynamically Load JavaScript - example of how to dynamically load a JavaScript program Development stage: 25% (as of Mar 19th, 2007)

[edit] Adding Graphs, Charts and Maps

  1. Pie Chart - draw a pie chart using range controls Development stage: 75% (as of Sept 17th, 2007)
  2. Google Charts - use the Google Charts REST web service Development stage: 25% (as of Jan 20th, 2008)
  3. Venn Diagram - change Venn diagram parameters with range controls Development stage: 25% (as of Jan 20th, 2008)
  4. Supply and Demand - use range controls to change price and see the impact on demand Development stage: 25% (as of Oct 10th, 2007)
  5. Graph Viewer - Viewing a graph of nodes and links Development stage: 75% (as of April 23th, 2007)

[edit] Development Tools

  1. Event Logger - demonstration of how to log events Development stage: 50% (as of Jan 8th, 2008)
  2. Replace Tester - testing regular expression substitution Development stage: 50% (as of Nov 5th, 2007)
  3. Process Step Editor - editing a list of horizontal process steps Development stage: 50% (as of Feb 17th, 2008)
  4. Application Builder - a form use to create a forms management application Development stage: 25% (as of Feb 22nd, 2008)
  5. Dashboard Builder - a form to specify the layout of a single page dashboard Development stage: 25% (as of May 15th, 2008)
  6. URL Rewriter - a form configure and test Jetty URL rewrite rules Development stage: 25% (as of Oct 30th, 2008)
  7. Web Service Tester - a form for testing a web service Development stage: 25% (as of Nov 21th, 2008)
  8. Synonym Set Editor - associate a synonym set with a business term Development stage: 75% (as of March 25th, 2008)

[edit] Other Examples

  1. W2 Tax Form - sample tax form based on Mozilla XForms site Development stage: 25% (as of Sept 6th, 2006)
  2. Invoice Manager - invoice manager Development stage: 25% (as of Oct 13th, 2008)
  3. Calculator - a four function calculator Development stage: 100% (as of Sept 6th, 2006)
  4. Crime Profile - sample of complex form used in criminal justice Development stage: 50% (as of March 6th, 2008)
  5. CSS tables - formatting tabular output with CSS without using HTML table Development stage: 50% (as of Sept 20th, 2006)
  1. Custom Controls - Example of a custom control using XBL Development stage: 75% (as of Oct 17th, 2006)
  2. Warn on Navigate Away - Warn users if they navigate away before saving Development stage: 75% (as of March 19th, 2007)
  1. Select All - Selecting all rows in a table Development stage: 25% (as of July 25th, 2007)
  2. Google Maps - Example of using Google Maps from within XForms Development stage: 00% (as of Nov 5th, 2007)
  3. Sorting using XSLT - Example of how to sort an instance using a XSLT stylesheet Development stage: 75% (as of Jun 19th, 2007)

[edit] Mobile XForms

  1. Mobile XForms - Examples of XForm-based mobile applications Development stage: 25% (as of July 7th, 2007)

[edit] Client XForms Solutions

  1. FireFox Extension
  2. FormFaces
  3. Picoforms
  4. Ubiquity XForms - http://code.google.com/p/ubiquity-xforms/
  5. XSLTForms - Open source client-side implementation, not a plug-in or install, works with all major browsers (IE, FireFox, Opera, Safari, Chrome and more).

[edit] Server Solutions

  1. Apache - Configuring Apache to work with XForms Development stage: 25% (as of Feb 15th, 2007)
  2. Versioning Form Data With WebDAV and Subversion - Using subversion and WebDAV to automatically version form data
  3. IIS - Configuring Microsoft's IIS to work with XForms Development stage: 00% (as of Feb 15th, 2007)
  4. XML Databases - Using native XML databases to work with XForms Development stage: 00% (as of Feb 15th, 2007)
  5. eXist - Using the eXist OpenSource native XML database Development stage: 50% (as of Feb 15th, 2007)
  6. IBM DB2 - Using the DB2 v9 with XForms Development stage: 25% (as of Mar 19th, 2007)
  7. Orbeon Forms - Open Source Ajax-based XForms implementation (also comes with the Form Builder editor) Development stage: 00% (as of Nov 5th, 2007)
  8. Chiba - Open Source Java Implementation of the W3C XForms standard Development stage: 100% (as of Nov 27th, 2007)

[edit] Development Tools

  1. Form Generators
  2. NIEM to XForms
  3. Form Designers
  4. IBM Workplace Forms
  5. Intalio Form Designer
  6. Debugging XForms

Key to symbols:

Wikibook Development Stages
Sparse text 00%.svg Developing text 25%.svg Maturing text 50%.svg Developed text 75%.svg Comprehensive text: 100%.svg


XForms-best-practice.jpg indicates an XForms/Best practice

[edit] References

Debugging Tips

Retrieved from "http://en.wikibooks.org/wiki/XForms"