Trying to use Dijit but getting: Dojo is not defined

Question

I am trying to include a demo dijit widget in my template. However, I keep getting: "Dojo is not defined". I tried to find an answer, but I couldn't. This error is odd as the required dojo.js is indeed loaded by the browser.

What is not working is:

dojo.require("dijit.form.MultiSelect");

However, if I use other dojo modules doing:

require(["dojo/store/JsonRest" ...

It works.

I made pastebin of my template here: http://pastebin.com/9fm13pSP

Answer 1

Is this Dojo 1.7?

For that version, I think Dojo expects the functions define() and require() to be defined in the global namespace.

These functions are then used to require dojo itself. Your dojo.js may have all the libraries in it, but they might not be available to use until you explicitly require them.

This worked for me (using Dojo 1.7.2):

<script>
// Dojo 1.7 (AMD)
require(["dojo"], function(dojo){

dojo.require("dijit.form.MultiSelect");
dojo.ready(function(){
        var sel = dojo.byId('dynamic');
        var n = 0;
        for(var i in dijit){
                var c = dojo.doc.createElement('option');
                c.innerHTML = i;
                c.value = n++;
                sel.appendChild(c);
        }
        new dijit.form.MultiSelect({ name: 'dynamic' }, sel);
});

});
</script>

Answer 2

As Paul Grime pointed out, if you include Dojo 1.7 with the async:true flag set (as you did) it will only expose the require and define functions to the global namespace. This is part of the transition to the new style of AMD modules that was recently introduced.

You can now choose to either

1. Add that little "require dojo" wrapper around the code

2. Remove the "async:true" flag and rely on back-compatibility with 1.6

3. Convert your code to using the new 1.7 AMD asynchronous modules instead of the old synchronous style with "dojo.require".