TOC widget breaks dojo expandopane and +/- buttons

[Charlesshultz]

I am implementing a user submitted TOC widget from:
http://www.arcgis.com/home/item.html?id=9b6280a6bfb0430f8d1ebc969276b109
I imagine a few of you have this in your applications as I have found no other widget that combines layer controls with legend display. The 2 issues I am having after I have it working is that it disables the expandopanes in the application and I cannot figure out how to get the +/- buttons on a group instead of a check box like the example here:
http://gmaps-utility-gis.googlecode.com/svn/tags/agsjs/2.03/examples/toc.html
The expandopane issue is a real killer for my app as I use them for a few things. If I take this code out that creates it�?� the expandos work fine. But as soon as I put the TOC in, the expandos stop working?

dojo.connect(map, 'onLayersAddResult', function (results) {
        var toc = new agsjs.dijit.TOC({
            map: map,
            style: "inline",
            layerInfos: [{
                layer: DynamicLayers,
                title: "Base Data",
                slider: true
            }]
        }, 'tocDiv3');
        toc.startup();
    });

Any ideas would really be appreciated

Also, I forget to say that I needed to add this code above the current code to make it work or I get an error:
Error: Unable to draw graphic (geometry:null, symbol:null): Tried to register widget with id==tocDiv2 but that id is already registered AND
Error: Tried to register widget with id==tocDiv2 but that id is already registered

    var TOCDiv = dijit.byId('tocDiv2');
    if (TOCDiv) {
        TOCDiv.destroyRecursive(true);
    }

This may have something to do with it also... but I am not sure.

[Charlesshultz]

Ok... I solved the expando issue. I just wrapped that in another div and destroyed the inner div so not to run into issues with the left,center,right of the expandos.

That being solved, does anyone have an idea on the +/- buttons not showing?

Thanks..

[AdrianMarsden]

Have you linked in the expandopane CSS?

http://serverapi.arcgisonline.com/jsapi/arcgis/3.3/js/dojo/dojox/layout/resources/ExpandoPane.css

the Style isn't in the main CSS.

ACM

[Charlesshultz]

The  +/- button issue I am having is with NLiu's TOC Widget.
[ATTACH=CONFIG]23707[/ATTACH]
It works great but the +/- buttons are not present in my app? I have the layers grouped in the mxd.
Has anyone had experience with this?
Thanks

[KevinMacLeod1]

So you're using dynamic layers I presume based on your layername? I mention this since this issue with no expandopanes happens with featureLayers.

We're using this widget. Works great. I have multiple instances of it in accordions, with many groups and even subgroups in my MXD that carry through perfectly to the AGS TOC instances. All in a dynamic service.

Can you post all your code in? That may help identify the issue.

[Charlesshultz]

Sure not problem.....
Issue: Not getting the +/- buttons in the NLiu's TOC Widget.
I have a mxd with 3 layers. They are in a group.
In the HTML Page:

<script type="text/javascript">
    var dojoConfig = {
        parseOnLoad: true,
        packages: [
          { name: "esriTemplate", location: location.pathname.replace(/\/[^/]+$/, '') },
          {  "name": "agsjs",
              "location": 'http://gmaps-utility-gis.googlecode.com/svn/tags/agsjs/2.04/xbuild/agsjs'
          }
        ]
    };
    </script>

     <div id ="LeftPane" dojotype="dijit.layout.ContentPane" region="left" style=" width:250px">
           <div id ="tocDiv3" >
           </div>
     </div>

In the JS file:

   

var My_Layer = new esri.layers.ArcGISDynamicMapServiceLayer("http://xxxx:6080/arcgis/rest/services/MyService/MapServer", 
       {
        id: 'My_Layer ',
        opacity: 0.8
        });
        ........
    

    dojo.connect(map, 'onLayersAddResult', function (results) {
        var toc = new agsjs.dijit.TOC({
            map: map,
            style: "inline",
            layerInfos: [{
                layer: My_Layer,
                title: "My Company",
                slider: true
            }]
        }, 'tocDiv3');
        toc.startup();
    });

Thanks for your help...

[Charlesshultz]

Does anyone have an idea on this? Has this happened to anyone else?

[DouglasGuess]

Were you able to find a solution to this?  I'm having the same issue.

[JamesVillanueva]

If someone can put a simple working example up for this, I will take a look at the problem. I did this as well a while back in my project, but my code has become too complex to use here. If someone puts a simple working sample up on here I will look at the issue. I do remember that this is a CSS issue.