I have developd a map with TOC, Navigation Toolbar and some other query options using Javasctipt API in .aspx page. When I run it individually, it is working perfectly, but I want to embed it into another .net application.

In .NET application I have a page with one dropdown with various options. Upon selection of option from dropdown I need to show the above said map.

Iam getting below error.

**Message: Could not load class 'dijit.layout.BorderContainer Line: 15 Char: 133114 Code: 0

I have hosted Javascript API in my local IIS.

Can anyone help me how to resolve the above issue.

Thanks, Uday

  • 3
    Would it be possible to post some code? The error just sounds like the BorderContainer isn't bought in as a dependency but as it's working when it's run alone then there must be more to it than that – David Wilton Dec 4 '12 at 7:45
  • 1
    I was having same problem and it was due to closing of bracket.I missed to close one bracket.Please check if all brackets are closed. – Gunner Dec 4 '12 at 8:26
  • following @Gunner, javascriptlint.com/online_lint.php to check your JS syntax (it's much nicer to deal with than jslint - personally I object to a syntax checker telling me I have 'too much whitespace') – tomfumb Dec 4 '12 at 17:48

If you are embedding your ArcGIS Javascript navigation toolbar inside another .NET application (using an iFrame?), then maybe you should take care that the parent page in html, the one that contains the frame for your JS elements, has imported as well the dijit library with a <script> or dojo.require() label.

I think I had this problem some time ago and if I don't remember bad, that was the solution.


According to the documentation for dijit/layout/BorderContainer, each child of the BorderContainer must have a "region" attribute that tells where it's located on the page. For example:

<div data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="gutters:true, liveSplitters:true" id="layoutPriorityBorderContainer">
    <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="splitter:true, region:'left'" style="width: 100px;">Left</div>
    <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="splitter:true, region:'center'" style="width: 100px;">Center</div>
    <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="splitter:true, region:'right'">Right</div>


<div data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'sidebar', gutters:true, liveSplitters:true" id="layoutPriorityBorderContainer">
    <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="splitter:true, region:'leading', layoutPriority:1" style="width: 100px;">Left #1</div>
    <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="splitter:true, region:'leading', layoutPriority:2" style="width: 100px;">Left #2</div>
    <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="splitter:true, region:'center'">Hi, I'm center</div>

Make sure each child of the BorderContainer is a dijit with a region assigned.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.