I am pleased to share one creation of mine .
The following widget is a XBL binding based on the XUL’s XNL templates technology.
https://developer.mozilla.org/en/XUL/Template_Guide/XML_Templates
If you need to display xml data into a xul menulist -combobox- or in a radiogroup -radiobox-, without having to implement an XML parser, here is the solution :
xml-combobox
xml-radiobox
<xml-combobox id="myid" datasources="chrome://application/pathtoxmlfile" expr=""/>
<xml-radiobox id="myid" datasources="chrome://application/pathtoxmlfile" expr=""/>
Attributes :
datasources : URL of an XML document, either a local file or a remote web site.
expr : the expr attribute is a very simple XPath expression which simply retrieves the root elements of your query within the datasource.
label :
- starting with « ! » : an XPath expression corresponding to the node you want to use as a label.
- starting with « ? » : a property of the node corresponding to the expr result, you want to use as a label.
- Otherwise just a text used as a label for all the generated lines (can be empty).
value :
- starting with « ! » : an XPath expression corresponding to the node you want to use as a value.
- starting with « ? » : a property of the node corresponding to the expr result, you want to use as a value.
- Otherwise just a text used as a value for all the generated lines (can be empty).
image :
- starting with « ! » : an XPath expression corresponding to the node you want to use as an image.
- starting with « ? » : a property of the node corresponding to the expr result, you want to use as an image.
- Otherwise just a text used as an image for all the generated lines (can be empty).
imageBaseFolder : if the attribute image is used, the base folder where to look the images for. Useful if the image query result is just a file name, or a relative path. Must contain the final « / » or « \ ». Can be left empty.
orient : (xml-radiobox only) : « horizontal » or « vertical ».
onselect: occurs when selection changed.
Examples :
Example 1 : simple example using the properties of a XML node
<people>
<person name="Napoleon Bonaparte" id="NB"/>
<person name="Cleopatra" id="Cl"/>
<person name="Julius Caesar" id="JC"/>
<person name="Ferdinand Magellan" id="FM"/>
<person name="Laura Secord" id="LS"/>
</people>
<xml-combobox id="myid" datasources="chrome://application/pathtoxmlfile" expr="person/" label="?name" value="?id"/>
Example 2 : using a node property for the id and a XPath from the targeted node for the label (here the text contained in the subnode « name »)
<people>
<person id="NB">
<name>Napoleon Bonaparte</name>
<gender>Male</gender>
</person>
<person id="Cl">
<name>Cleopatra</name>
<gender>Female</gender>
</person>
<person id="JC">
<name>Julius Caesar</name>
<gender>Male</gender>
</person>
<person id="FM">
<name>Ferdinand Magellan</name>
<gender>Male</gender>
</person>
<person id="LS">
<name>Laura Secord</name>
<gender>Female</gender>
</person>
</people>
<xml-radiobox id="myid" datasources="chrome://application/pathtoxmlfile" expr="person/" label="!./name/text()" value="?id" orient="horizontal"/>
Example 3 : same as example 2 but with a xml-combobox and using the image property and imageBaseFolder to specify where the widget should look the images for
<people>
<person id="NB">
<name>Napoleon Bonaparte</name>
<gender>Male</gender>
<picture>nap.png</picture>
</person>
<person id="Cl">
<name>Cleopatra</name>
<gender>Female</gender>
<picture>cleo.png</picture>
</person>
<person id="JC">
<name>Julius Caesar</name>
<gender>Male</gender>
<picture>julius.png</picture>
</person>
<person id="FM">
<name>Ferdinand Magellan</name>
<gender>Male</gender>
<picture>magellan.png</picture>
</person>
<person id="LS">
<name>Laura Secord</name>
<gender>Female</gender>
<picture>secord.png</picture>
</person>
</people>
<xml-combobox id="myid" datasources="chrome://application/pathtoxmlfile" expr="person/" label="!./name/text()" value="?id" imageBaseFolder="chrome://application/skin/pic_small/" image="!./picture/text()"/>
And like all the XBL widgets, the bindings need to be done in a CSS :
xml-combobox{
-moz-binding: url("chrome://application/content/bindings/xml-combobox.xml#xml-combobox") !important;
}
xml-radiobox{
-moz-binding: url("chrome://application/content/bindings/xml-radiobox.xml#xml-radiobox") !important;
}