A. Wheatman
A. Wheatman

Reputation: 6378

Load and use Dojo widget from jQuery

I know that there are a lot of questions on the forum about the subject but I still can't find the answer...

I have the JS application based on jQuery. Now I have to do some integration some widget based on Dojo. I want to load Dojo and the widget only when it's necessary, so want to do this asynchronously. I have the Dojo stored on my site, so load it from my space.

Here is the code that I try to use in jQuery:

$.getScript("/Content/3rd/dojo/dojo/dojo.js")
.done(function (script, textStatus) {
    dojo.ready(function () {
        dojo.require("dojo.io.script");

        alert('Dojo ready!')
    });
})
.fail(function (jqxhr, settings, exception) {
    alert('error!');
});

My problems start from the beginning when I try to call dojo.require("dojo.io.script"); that is needed for asynchronous requests and I see that it tries to load dojo.io.script from the following Url - '/Example/io/script.js' and that's not exactly the place where it is located. I suspect that I missed some configuration issue but can't understand which one... can somebody help me to resolve it?

Maybe it's trivial question but I never worked with Dojo and just need to do quick integration with the widget based on Dojo, myy main application on jQuery...

SOLUTION:

just in case if somebody interested, I use the next script to load the widget:

//  Load Dojo and scripts for JSDraw2 asyncronously
dojoConfig = {
    baseUrl: "/Content/3rd/dojo-1.8.3/dojo"
};

$.getScript("/Content/3rd/dojo-1.8.3/dojo/dojo.js")
.done(function (script, textStatus) {
    dojo.ready(function () {
        dojo.require("dojo.io.script");

        var deferred = dojo.io.script.get({ url: "/Content/3rd/JSDraw2.1.4/JSDraw2.js" });
        deferred.then(function () {
            // init the Dojo widget... 
            oThis.jsDraw = new JSDraw(oThis.element.get(0));
        }, function () {
            alert('Cannot load Scilligence.JSDraw2.js');
        });
    });
})
.fail(function (jqxhr, settings, exception) {
    alert('Cannot load Dojo.js');
});

Upvotes: 1

Views: 795

Answers (1)

Jeremy
Jeremy

Reputation: 3528

Well to use Dojo it needs a configuration to go with it, and this needs to be loaded before the dojo.js script is pulled in.

The Dojo docs suggest putting the config into your index file (or equivalent) head, but I guess you could create it before you pull down the dojo code, especially if you know when you'll need it.

So perhaps try creating a global variable called "dojoConfig" just before you pull in dojo.js. Here is an example config I used on a web app not to long ago, but it would benefit you to read up on it as well to get a rounder idea of why and what it is there for, and what dojo does and when. I'd recommend reading the dojo start and hello dojo tutorial as a minimum, then moving through the config and widget based tutorials. you may want to read up on how dojo uses AMD principles as well.

<script>
    var dojoConfig = {
        baseUrl: "./",//this is where dojo will lok from for all locations configured
        async: true,
        isDebug: false,
        parseOnLoad: false,//false to allow for us to call this independently in js later on

        //here are the packages dojo will be aware of and related js files
        packages: [
            //dojo specific packages
            {name: "dojo", location: "libs/dojo/1.8.1/dojo", main: "dojo.js.uncompressed.js"}, //dojo.js.uncompressed.js for dev, use dojo.js for release
            {name: "dijit", location: "libs/dojo/1.8.1/dijit"},
            {name: "dojox", location: "libs/dojo/1.8.1/dojox", main: "dojo.js"}
        ]
    };
</script>

My config includes dojox and dijit, but of course if you dont need them then just remove those lines. Although you did mention dojo widgets and dijit is where dojo gets its "widget power" from.

You'll want to change the config's base url to reflect your own location for dojo, and likewise for the locations. Look at the dojo config tutorial for more details on this and other attributes.

Sorry for the multitude of links above, whilst dojo 1.8 is an excellent framework, especially when working with modules, it will take a curve of learning to start using it as you intend to. I have never tried to load dojo late in the game like that before, so I'm interested to hear how you get on to be honest.

Good luck anyway.

Upvotes: 1

Related Questions