- The Book of Dojo
- Quick Installation
- Hello World
- Debugging Tutorial
- Introduction
- Part 1: Life With Dojo
- Part 2: Dijit
- Part 3: JavaScript With Dojo and Dijit
- Part 4: Testing, Tuning and Debugging
- Part 5: DojoX
- The Dojo Book, 0.4
dojo.addOnLoad
Submitted by criecke on Sat, 04/07/2007 - 18:01.
dojo.addOnLoad(Function fn)
Sooner or later, every Javascript programmer tries something like this:
<script>
if(dayOfWeek == "Sunday"){
document.musicPrefs.other.value = "Afrobeat";
}
</script>
<form name="musicPrefs">
<input type="text" name="other">
...
if(dayOfWeek == "Sunday"){
document.musicPrefs.other.value = "Afrobeat";
}
</script>
<form name="musicPrefs">
<input type="text" name="other">
...
It doesn't work because the "other" control is not defined yet. You can move the code to the bottom of the page, but that removes the linear nature of HTML. If you're reading the code, you want to zero in on a control, and see the code that influences it close by.
dojo.addOnLoad(...) defers script execution until all the HTML is loaded. So this code:
function setAfrobeat(){
document.musicPrefs.other.value="Afrobeat";
}
dojo.addOnLoad(setAfrobeat);
document.musicPrefs.other.value="Afrobeat";
}
dojo.addOnLoad(setAfrobeat);
conveniently replaces the one above. When the function is small, you may prefer to write it inline:
dojo.addOnLoad(
function(){
document.musicPrefs.other.value="Afrobeat";
}
);
function(){
document.musicPrefs.other.value="Afrobeat";
}
);
This is the function literal or anonymous function construct of JavaScript. If it looks really, really wierd to you, take a peek ahead at Functions as Variables for an explanation.
- Printer-friendly version
- Login or register to post comments
- Unsubscribe post
Load your own libraries after...
I'm not completely sure why this is, but when I tried to load my own js library before dojo.addOnLoad(), it was as if the dojo.addOnLoad() was not called. I moved the
<script>tag to after the dojo.addOnLoad(), then it worked.So my
<head>element contains all dojo stuff first, then a single call to load my own script library. Perhaps after some more experience I can figure out why this is.Importantance of wrapping dojo in dojo.addOnload
dojo.require statements execute asynchronously! Therefore code that instantiates a widget may have unpredictable results if not "wrapped" by dojo.addOnLoad. (i.e. make sure that dojo is fully initialized before using any widget from javascript).
dojo addOnLoad
can we have two or more dojo addOnLoad function in the same web page?
will it works?
--Nandhini Jayakumar
I'm no expert, but yes
I'm no expert, but I've done that, so I believe the answer is yes :) In fact, I ran into a problem declaring a dijit.form.ComboBox programatically, and wrapping it in an addOnLoad fixed it.
There is no need for more than one addOnLoad
You can put as many functions inside of the one addOnLoad as you need.
Multiple pointers?
Is it possible to pass more than one function/method pointer at a time to dojo.addOnLoad()?
It seems like a waste to create an anonymous function to execute things that are already functions.
onLoad?
I've got a problem.
I charge a page via xhrGet into a dojox.contentPane so I can execute js elements inside, and I want to include some dojo element into this code. But all addOnLoad functions are ignored. I manage using a normal function invoked in-line, but this build the page at the end of all, and sometime it crashes too.
How can I do?
onLoad? part 2
I've discovered where's the problem, I think: it execute the addOnLoad the first time I charge the content, but when I try to do it again, it doesn't work. I suppose the browser think that it is no more necessary because it has already done :)
Can I force it to do it again?
Or does anyone have a better idea to do it?
Object has no properties
Sometimes while working with dojo with Weblogic Portal 9.2 I have issues with objects not having properites("myObj has no properties"), more times than not it is due to the fact that I call the fuction directly as so:
dojo.addOnLoad(init());
Found if I wrap it in a function() inline this problem goes away:
dojo.addOnLoad(function(){init();});
Hopefully this will help out other folks...
J
if you call
if you call dojo.addOnLoad(init) it will register the function to be added on load -- in your example you are immediately calling init(), and passing that value to dojo.addOnLoad, which expects a function reference (without the () )