4.1 Aggregation Using group
XForms aggregation construct group can be used to group logically related user interface controls. When introducing the notion of hierarchical data models, we saw how related variables were grouped into higher-level aggregations. Thus, the house number, street name, city name , and ZIP code are typically grouped into an address structure. Construct group enables similar functionality on the user interface side.
When modeling data, grouping related variables into appropriate hierarchical structures leads to data encapsulation. When creating user interfaces, grouping logically related controls results in related parts of a user interface being encapsulated in logical containers. When rendering the final presentation, this logical grouping can be used to advantage in refactoring the user interface in a manner appropriate for the target device. Such grouping can also help in navigating through a complex user interface. We show an example of the use of element group in grouping together the various user interface controls making up a conceptual address control in Figure 4.1. The result of rendering this example using X-Smiles is shown in Figure 4.2.
Figure 4.1 Grouping related controls using construct group .
< html xmlns ="http://www.w3.org/1999/xhtml"> < head >< title >Address Form</ title > < model xmlns ="http://www.w3.org/2002/xforms"> < instance > < address xmlns =""> < name />< street />< city />< state />< zip /> </ address ></ instance > </ model ></ head > < body > < group xmlns ="http://www.w3.org/2002/xforms" ref ="/address" accesskey ="a"> < label >Mailing Address</ label > < input ref ="name">< label >Name</ label ></ input > < input ref ="street">< label >...</ label ></ input > < input ref ="city">< label >City</ label ></ input > < input ref ="state">< label >...</ label ></ input > < input ref ="zip">< label >ZIP</ label ></ input > </ group ></ body ></ html >
Figure 4.2. X-Smiles rendering of related controls using construct group .
4.1.1 Labeling Groups
Element label can be used to attach a meaningful label to a group. As in the case of user interface controls, the contents of the label can be specified directly within element label or indirectly via a URI. Placing meaningful labels on element group has several advantages:
4.1.2 Navigating among Groups
Logically grouped controls enable the user to navigate through complex user interfaces. As in the case of user interface controls, attribute accesskey on element group can be used to specify an accelerator key that moves focus to the group. As an example, Figure 4.1 specifies a value of a for attribute accesskey . In this case, pressing a with the appropriate platform-specific modifier key would move to the address group. This moves focus to the user interface control within that group that appears first in navigation order. Attribute navindex on element group can be used to refine this process further if needed.
4.1.3 Groups and Binding Expressions
Attribute pair ( model , ref ) can be used on element group , as in Figure 4.1. The binding expression on element group sets up the context for resolving relevant XPath expressions within element group . The binding expression factors out those parts of the XPath binding expression that are common to all user interface controls in the group and therefore serves to ease authoring.
In addition, using element group to set up the XPath context for user interface controls within a group and using relative binding expressions on the various controls make the resulting XForms document easier to maintain. For example, consider the example shown in Figure 4.1 where element address is assumed to occur at the root of the instance tree. To change this example to be more realistic where the mailing address appears lower down within the instance tree, for example, /invoice/address , we need only edit the binding expression on element group . Contrast this with using absolute XPath expressions on the user interface controls making up the address user interface.
Using binding expressions on element group has one final subtle advantage. One of the main reasons for HTML's early success was the ability of users to cut and paste portions of the HTML source they saw on the Web to create their own Web pages. The XForms working group considered this a key enabler for rapid adoption of a new markup language. Using binding expressions on element group as described here enables such cut and paste authoring.