XForms, Controlling Button Appearance

This example demonstrates how to control the button appearance using labels, hint text and images. To see the button images appear you will need to create a file called XForms-button.jpg in the folder that this program is executed from.

This example requires an image to be used in the program.

This image can be downloaded from here:

.

Program

xmlns="http://www.w3.org/1999/xhtml"
xmlns:xf="http://www.w3.org/2002/xforms"
xmlns:ev="http://www.w3.org/2001/xml-events">;

XForms Trigger Appearances

xmlns="">

Label text from the model
Message text from the model
Hint text from the model

method="post" id="submission" />

Test of Trigger Appearances
A simple model button that brings up a message in a window:

Simple Button
level="modal" ev:event="DOMActivate">Button clicked

A model button that also displays "hint text" when you hover over the button:
/>

Button With Hint Text On Hover
level="modal" ev:event="DOMActivate">Button clicked
This is the hint text.

/>

A button that includes an image and hint text:
/>
appearance="xf:image">
src="XForms-button.jpg" />
level="modal" ev:event="DOMActivate">Image
clicked
This hint text comes up if you hover over a button.

/>

A button that includes text, and image and text:
/>
appearance="xf:image">
Text before the image... src="XForms-button.jpg" /> ...text after the image.
level="modal" ref="message" ev:event="DOMActivate" />
Hints work with labels and images.

/>

A trigger that extracts the label, hint and message text from the model:
/>

ref="label" />
level="modal" ref="message" ev:event="DOMActivate" />
ref="hint" />

/>

Discussion

The XForm specification also uses the xf:help tag. to allow for context sensitive help.
This tag would work just like the hint tag but would be activated by the browser or systems help function. You can use a style sheet to also use the help tag.

Where this page came from

This page was imported from Wikibooks. From “XForms” on Wikibooks, by its contributors, under CC BY-SA 4.0. Changed here: set as a page; navigation and edit links left out; each image under its own licence, credited in its caption.

Nobody has written it yet — it is the source material at a new address, which is why search engines are asked to skip it and why no one earns from it. It is up for grabs: take it on, and it is yours to rewrite and to earn from.