WidgetNamespaces
Version 12, changed by morris 09/02/2006. Show version history
See WidgetExamples for some background on how to use widgets in Dojo.
Using Widgets with Namespaces (Available post 0.3.1)
When using markup to lay out widgets in Dojo, it is possible to use XML-style namespaces in your document to specify them. Dojo's parser will simply scan the tags in the document and look for a ":" delimiter, regardless of whether an XHTML document or namespace-capable browser was used. So, while this does not imply any XML or XHTML in the strict sense, namespace declarations may be used pro forma. Hopefully this capability will be useful when working with validating XML-compliant tools.
The default is the "dojo" namespace, as in the case where a button
is placed on an HTML page. The default namespace of tags is HTML.
Here a Dojo widget is specified.
<dojo:button>Click here!</dojo:button>
or alternatively:
<div dojoType="dojo:button">Click here!</div>
The dojoType attribute specifies a widget as if it were used
directly in the tagname. With dojoType, the default namespace is
"dojo".
Widgets in the Dojo namespace are typically provided by the Dojo
toolkit by convention. New namespaces are easily defined, for example:
<acme:button>Drop anvil</acme:button>
or, using the alternative dojoType syntax:
<div dojoType="acme:button">Drop anvil</acme>
These widgets may also be instantiated programmatically:
dojo.widget.createWidget("acme:button", {id: "button1"});
For the moment, widgets and their namespaces are case-insensitive.
XML/XHTML style tags
Dojo does support XML style tags of the format <dojo:Checkbox>. You may choose to use them depending on which browsers you need to support (some older browers will have problems with XML style tags).
They are treated slightly differently between browsers and you need to be aware of rendering issues and other differences.
Internet Explorer and XML/XHTML style tags
XML tags are not supported for IE by Dojo version 0.3.1.
If you wish to support IE6 or IE7 with XML tags then you must declare your namespace and the dojo namespace within the html tag like so:
<html xmlns:dojo xmlns:mycustomns>
If you do not declare the namespace within the HTML tag of your page then:
- A tag like <dojo:Checkbox> is actually treated like <dojo:Checkbox />. For example <dojo:Button>caption</dojo:Button> doesn't show the caption in the button.
A tag like </dojo:Checkbox> is added as a DOM element node rather than just acting as a closing tag (a closing tag should not be added as a node into the DOM at all).
Also note that a custom tag without a namespace like <Checkbox> in IE is sometimes completely skipped, and trying to use innerHTML or appendChild() on such an element causes exceptions.
Gecko and XML/XHTML style tags
The element is not a normal HTML element, so attributes like style and className are ignored.
Anything declared inside a ns:tagname tag is not rendered. This has the effect of hiding the widget until it is created - however if you want to hide widgets until creation you should use display:none so that the appearance is the same across browsers (especially IE which renders XML tags as HTML).
Examples
Some tests (may use old defineNamespace call - not sure if updated yet): http://archive.dojotoolkit.org/nightly/tests/widget/namespaces/
Or see near the bottom of this page (also shows how to define a widget with a html and css template within a single page): http://archive.dojotoolkit.org/nightly/tests/widget/test_Custom_Widget_Inline.html
