TOC Issue

777
4
06-04-2014 03:39 AM
deleted-user-yA_w_FC9FKe5
New Contributor III
I'm converting from Legacy to AMD.  The last thing I think I need to do is convert my TOC.  It is acting strange at the moment, sometimes it comes in and sometimes it does not.  However, in the legacy it always comes in without any issues.  Really weird.

Am I doing something wrong?  Below is just the TOC code and I put the whole code at jsbin.  Any idea what could be causing this?
http://jsbin.com/cezej/1/edit


dojo.connect(map, 'onLayersAddResult', function(results) {
               //alert("Test")

       var standardTOC = new agsjs.dijit.TOC({
                  map: map
      //noLegend: true
                }, 'standardDiv');
                standardTOC.startup();
   
    //alert("test2")
    var sliderTOC = new agsjs.dijit.TOC({
                  map: map,
                  layerInfos: [
           {
                    noLayers: true,
     showGroupCount: true,
     layer: flMCY_Stores_Regions,
                    title: "Macy's Stores District"},
    {
        noLayers: true,
                    layer: flMCY_Stores,
                    title: "Macy's Stores Region",

                  },
    
      {
        noLayers: true,
                    layer: dlDRegionDistrictPolygons,
                    title: "Boundary Files",
                    slider: true
                  }
    
      ], style:'inline'
                }, 'sliderDiv');
                sliderTOC.startup();   
              });
0 Kudos
4 Replies
TimWitt
Frequent Contributor
The AMD version of connect is on, like this:

map.on("layers-add-result", function (results) {
0 Kudos
KenBuja
MVP Esteemed Contributor
You're mixing versions of the stylesheets and the version of the JSAPI

    <link rel="stylesheet" href="http://js.arcgis.com/3.9/js/dojo/dijit/themes/claro/claro.css">    
    <link rel="stylesheet" href="http://js.arcgis.com/3.9/js/dojo/dijit/themes/nihilo/nihilo.css">    
    <link rel="stylesheet" href="http://js.arcgis.com/3.9/js/esri/css/esri.css">
    <link rel="stylesheet" href="css\MyMobileMaps.css">
      <link rel="stylesheet" type="text/css" href="https://community.esri.com//js.arcgis.com/3.9/js/dojo/dojox/layout/resources/FloatingPane.css">
    <link rel="stylesheet" type="text/css" href="https://serverapi.arcgisonline.com/jsapi/arcgis/3.4/js/dojo/dojox/layout/resources/ResizeHandle.css">
    <link rel="stylesheet" href="http://js.arcgis.com/3.9/js/dojo/dojox/grid/resources/Grid.css"> 
      <link rel="stylesheet" href="http://js.arcgis.com/3.9/js/esri/css/esri.css">

<script src="http://js.arcgis.com/3.8/"></script>


You also might want to use the latest version of the TOC control

packages: [{
     "name": "agsjs",
     "location": 'http://gmaps-utility-gis.googlecode.com/svn/tags/agsjs/latest/build/agsjs' // for xdomain load
}]


Also, check your require statement. There are a couple of funky things in there. For example, "dojo/domReady!" should be at the end and doesn't need a corresponding argument in the function. See this blog for more information. Also you have a couple of modules that don't follow the syntax convention of using "/" instead of "."

"dojo.fx",// needed if use jsapi 3.0    
"esri.arcgis.utils",
"dijit.form.ToggleButton",
"dijit.TitlePane"    
              
0 Kudos
deleted-user-yA_w_FC9FKe5
New Contributor III
The AMD version of connect is on, like this:

map.on("layers-add-result", function (results) {


I tried this but still not getting anything:

map.on("layers-add-result", function (results) {
               //alert("Test")

       var standardTOC = new agsjs.dijit.TOC({
                  map: map
      //noLegend: true
                }, 'standardDiv');
                standardTOC.startup();
    
    //alert("test2")
    var sliderTOC = new agsjs.dijit.TOC({
                  map: map,
                  layerInfos: [
           {
                    noLayers: true,
     showGroupCount: true,
     layer: flMCY_Stores_Regions,
                    title: "Macy's Stores District"},
    {
        noLayers: true,
                    layer: flMCY_Stores,
                    title: "Macy's Stores Region",
 
                  }, 
     
      {
        noLayers: true,
                    layer: dlDRegionDistrictPolygons,
                    title: "Boundary Files",
                    slider: true
                  }
     
      ], style:'inline'
                }, 'sliderDiv');
                sliderTOC.startup();    
              });



        //map.addLayers([dlDRegionDistrictPolygons]);   
  map.addLayers([dlDRegionDistrictPolygons,flMCY_Stores,flMCY_Stores_Regions,dlMCY_Stores]);
0 Kudos
deleted-user-yA_w_FC9FKe5
New Contributor III
Ken I updated everything you said but still am having the issue.

Did I update everything to be the same versions of the stylesheets and the JSAPI?  I have everything at 3.9!!


    
    <link rel="stylesheet" href="http://js.arcgis.com/3.9/js/dojo/dijit/themes/claro/claro.css">    
    <link rel="stylesheet" href="http://js.arcgis.com/3.9/js/dojo/dijit/themes/nihilo/nihilo.css">    
    <link rel="stylesheet" href="http://js.arcgis.com/3.9/js/esri/css/esri.css">
    <link rel="stylesheet" href="css\MyMobileMacysMaps.css">
   <link rel="stylesheet" type="text/css" href="https://community.esri.com//js.arcgis.com/3.9/js/dojo/dojox/layout/resources/FloatingPane.css">
 <link rel="stylesheet" type="text/css" href="https://serverapi.arcgisonline.com/jsapi/arcgis/3.9/js/dojo/dojox/layout/resources/ResizeHandle.css">
    <link rel="stylesheet" href="http://js.arcgis.com/3.9/js/dojo/dojox/grid/resources/Grid.css"> 
   <link rel="stylesheet" href="http://js.arcgis.com/3.9/js/esri/css/esri.css">
  
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>



    <script>
    var dojoConfig = {
              parseOnLoad: true,
    packages: [{
      "name": "agsjs",
      "location": 'http://gmaps-utility-gis.googlecode.com/svn/tags/agsjs/latest/build/agsjs' // for xdomain load
    }]
            };
   </script>

 <script src="http://js.arcgis.com/3.9/"></script> 
  <script type="text/javascript" src="bookmarks/District_bookmarks.js"></script>   
<script type="text/javascript" src="bookmarks/Store_bookmarks.js"></script> 
 <script src="jsfiles\Real_Estate_Filters.js"></script> 




require([
        "esri/map",
        "esri/graphic",
        "esri/tasks/FindTask",
        "esri/tasks/FindParameters",
        "esri/symbols/SimpleMarkerSymbol",
        "esri/symbols/SimpleLineSymbol",
        "esri/symbols/SimpleFillSymbol",
        "esri/symbols/Font", 
        "esri/symbols/TextSymbol",
          
        "esri/Color",
        "dojo/on",
        "dojo/dom",
        "dijit/registry",
        "dojo/_base/array",
        "dojo/_base/connect",
        "dojox/grid/DataGrid",
        "dojo/data/ItemFileReadStore",
        "dijit/form/Button",
        "dojo/parser",
          
        "dijit/layout/BorderContainer",
        "dijit/layout/ContentPane",
  "dojox/widget/TitleGroup",
  "dijit/layout/AccordionContainer",
  "dijit/layout/TabContainer",
  "esri/dijit/Bookmarks",
  "esri/dijit/LocateButton",   
  "esri/dijit/HomeButton",
  "esri/dijit/BasemapGallery",
  "esri/layers/ArcGISDynamicMapServiceLayer",
  "esri/layers/FeatureLayer",    
    "esri/dijit/Measurement",  
     "esri/dijit/InfoWindowLite",
     "esri/InfoTemplate",
  "agsjs/dijit/TOC",  
//Floating Panel
    "dojox/layout/FloatingPane",
 "dojox/layout/Dock",
    "dojox/layout/ResizeHandle",
 "dojo/dnd/move",
 "esri/tasks/query",
 
//"esri.symbols.SimpleMarkerSymbol",
//Datagrid
"dojo/data/ItemFileWriteStore",
"esri/tasks/QueryTask",
"dojo/_base/Color",
"esri/Color",
"dojo/_base/connect",
"dijit/dijit",
"dojo/fx", 
"esri/arcgis/utils",
"dijit/form/ToggleButton",
"dijit/TitlePane",
"dojox/form/CheckedMultiSelect",
        "dojo/domReady!"
     
      ], function(
        Map, Graphic, FindTask, FindParameters, SimpleMarkerSymbol, SimpleLineSymbol, SimpleFillSymbol, Font, TextSymbol,Color, on, dom, registry, arrayUtils, connect, DataGrid, ItemFileReadStore, Button, parser, BorderContainer, ContentPane, TitleGroup, AccordionContainer, TabContainer, Bookmarks, LocateButton, HomeButton, BasemapGallery, ArcGISDynamicMapServiceLayer, FeatureLayer, Measurement, InfoWindowLite, InfoTemplate, TOC, FloatingPane, Dock, ResizeHandle, move, query, ItemFileWriteStore, QueryTask, Color, ESRIColor, connect, dijit,fx, utils, ToggleButton, TitlePane
      ) {      
0 Kudos