Chapter 6. Trees, Templates, and Datasources

The previous chapters covered some of the basic user interface widgets that are common to most applications. This chapter explores special-purpose widgets used to display hierarchies of topics. Specifically, we will cover:

  • The use of tree widgets to present categories of information to the user

  • The use of templates to ease the creation of trees when the source data is of a well-understood format

  • The role of datasources and the Resource Description Framework (RDF) in providing the developer with a framework to organize and present categories of information to the user


User interfaces that require a selection from a collection of options must often rely on some form of a list. The conventional approach in HTML is to present the options in the form of a <select> element that encloses all the options available to the user. But for an interface to present options that reflect some type of organizational structure or categories of selections—such as selections from a list of categorized bookmarks, or topic selection—a more flexible widget is required. For such cases, the XUL framework provides developers with the tree widget.

Tree Structure

In its simplest form, a tree widget consists of a collection of cells that can hold the displayed content, rows that contain a horizontal collection of cells, and columns that bind cells vertically. Figure 6-1 illustrates this simplest overview of the tree structure for a series of topic selections and descriptions. ...

Get Programming Firefox now with the O’Reilly learning platform.

O’Reilly members experience live online training, plus books, videos, and digital content from nearly 200 publishers.