renaming dojo namespace breaks dojo markup dijits?

LorenMueller · ‎08-17-2010

Hi,
I have an app that primarily uses programmatic custom dijit creation in conjunction with esri's jsapi (2.0). I thought the flexibility of changing the dojo namespace as described here looked nifty, but after some testing I have found that I can no longer create dijits in markup. Yikes! (or, what the heck am I doing wrong here )
In one page for testing start by adding the scopeMap item to djConfig, then reference the api, then reference some dijits like esriDojo.require("dijit.form.DropDownButton");, and then in the body try to create the dijit, but it will not work. When I remove the namespace customizations the DropDownButton works just fine. Does renaming the dojo namespace somehow break the in-line parsing on-load?

Take out the scopeMap and change the require statements back to regular dojo.require and the DDBtn works fine.

TEST PAGE

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>testing dojo Scope</title>

    
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.0/js/dojo/dijit/themes/tundra/tundra.css"/>

    
    <script type="text/javascript">
        djConfig = {
            parseOnLoad: true,
            scopeMap: [
                ["dojo", "esriDojo"],
                ["dijit", "esriDijit"],
                ["dojox", "esriDojox"]
            ]
        };
    </script>

    
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.0"></script>

    <script type="text/javascript">
            esriDojo.require("dijit.form.DropDownButton");
            esriDojo.require("dijit.Menu");
    </script>

</head>
<body class="tundra">

    <button dojoType="dijit.form.DropDownButton">
    <span>Test DDBtn</span>
    <div dojoType="dijit.Menu">
        <div dojoType="dijit.MenuItem" label="Some menu item 1">
            <script type="dojo/method" event="onClick" args="evt">
                console.log("ok");
                alert("ok");
            </script>
        </div>
        <div dojoType="dijit.MenuItem" label="Some menu item 2">
            <script type="dojo/method" event="onClick" args="evt">
                console.log("ok");
                alert("ok");
            </script>
        </div>
    </div>
    </button>

</body>
</html>

Thanks,
Loren

KellyHutchins · ‎08-17-2010

Loren,

I ran a quick test and it works if you change the attribute dojoType to esriDojoType. Here's the revised code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>testing dojo Scope</title> 

<!-- styling -->
<link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.0/js/dojo/dijit/themes/tundra/tundra.css"/>

<!-- Set dojo configuration -->
<script type="text/javascript">
djConfig = {
parseOnLoad: true,
scopeMap: [
["dojo", "esriDojo"],
["dijit", "esriDijit"],
["dojox", "esriDojox"]
]
};
</script>

<!-- v2.0 uses Dojo v1.4.2 -->
<script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.0"></script> 

<script type="text/javascript">

esriDojo.require("dijit.form.DropDownButton");
esriDojo.require("dijit.Menu");

</script>

</head>
<body class="tundra">

<button esriDojoType="dijit.form.DropDownButton">
<span>Test DDBtn</span>
<div esriDojoType="dijit.Menu">
<div esriDojoType="dijit.MenuItem" label="Some menu item 1">
<script type="dojo/method" event="onClick" args="evt">
console.log("ok");
alert("ok");
</script>
</div>
<div esriDojoType="dijit.MenuItem" label="Some menu item 2">
<script type="dojo/method" event="onClick" args="evt">
console.log("ok");
alert("ok");
</script>
</div> 
</div>
</button>

</body>
</html>

LorenMueller · ‎08-17-2010

Thanks Kelly! Works for me as well now. Much appreciated.
Loren

LorenMueller · ‎08-17-2010

Hi Kelly,
Now that I have implemented the change in my real code my local resources (custom dijits) will no longer load. I get 'could not load cross-domain resources' errors now. All of my djConfig settings are the same still, and I have implemented all the reccommendations from the dojo folks found here. Any thoughts on why that might be breaking due to the namespace change?
Thanks! - Loren