- The Book of Dojo
- The Dojo Book, 0.4
- Part 1: "Introduction"
- Part 2: "Out of the Box" Dojo
- Part 3: "The Dojo Programming Model"
- Part 4: "More on Widgets"
- Part 5: "Connecting the pieces"
- Part 6: "Customizing Dojo Builds for Better Performance"
- Part 7: "Utilities"
- Part 8: "Internationalization and Accessiblity"
- Part 9: "Dojo Community"
- Part 10: "Fresh From The Shed" Dojo
- BookWriting
- Glossary
Order matters
Submitted by criecke on Sun, 02/04/2007 - 20:36.
In general, a script should do the following in the ... section:
- (Optional) set the djConfig options
- Load the Dojo script
- Call dojo.require(...) for all libraries used in the page
- (Optional) define initialization functions and call addOnLoad
<!-- Step 1 (Optional) Set djConfig -->
<SCRIPT type=text/javascript>
djConfig = {
debug: true
};
</SCRIPT>
<!-- Step 2: Load dojo -->
<SCRIPT src="js/dojo/dojo.js" type=text/javascript></SCRIPT>
<!-- Step 3: call dojo.require -->
<SCRIPT>
dojo.require("dojo.book.myWidget.*");
<!-- Step 4 (Optional): define initialization functions -->
function initMyStuff() {
...
}
dojo.addOnLoad(initMyStuff);
</SCRIPT>
The order is important! If you do the steps out of order, dojo may not initialize properly, and your page will be a mess.
This script element is responsible for loading the base Dojo script that provides access to all the other Dojo functionality. Following this we add the requires statements which pulls in functionality needed by the application.
Use the dojo.addOnLoad to call functions which use the widget ids because Dojo must completely load the page and finish parsing the HTML before a reference can be made to the id. So, for example, the following will not work:
<BUTTON widgetId="helloButton" dojoType="Button">Hello World!</BUTTON>
<SCRIPT>
// ILLEGAL!! helloButton does not exist yet
dojo.byId("helloButton").width2height = 0.5;
</SCRIPT>
Instead, place the script in an initialization function:
<SCRIPT src="js/dojo/dojo.js" type=text/javascript></SCRIPT>
<SCRIPT>
function initMyStuff() {
dojo.byId("helloButton").width2height = 0.5;
}
dojo.addOnLoad(initMyStuff);
</SCRIPT>
<BUTTON widgetId="helloButton" dojoType="Button">Hello World!</BUTTON>
