AnsweredAssumed Answered

ArcGIS JavaScript Table of Content (TOC checkboxes)

Question asked by vince_awino on Jan 23, 2014
Latest reply on Aug 18, 2014 by kenbuja
Please help, everything else is working well, but the checkboxes for the table of content are not displaying. what I'm I doing wrong? im trying to follow the sample code in this link here but with AMD. please help. the code is as shown below.


<script>  require(    [ "dojo/parser", "dijit/layout/BorderContainer",      "dijit/layout/ContentPane",      "dijit/layout/AccordionContainer", "esri/map",      "esri/dijit/BasemapToggle", "esri/layers/FeatureLayer",      "dojo/on", "esri/dijit/Legend", "dojo/_base/array",      "dijit/form/CheckBox", "dojo/dom-construct",      "dojo/domReady!" ],    function(parser, BorderContainer, ContentPane, AccordionContainer,      Map, BasemapToggle, FeatureLayer, on, Legend, arrayUtils,      array, CheckBox, domConstruct) {     parser.parse();     //Add Basemap     var map = new Map("map", {      sliderOrientation : "horizontal",      center : [ 34.942, -0.143 ],      zoom : 14,      basemap : "osm",     });     //toggle Basemap     var toggle = new BasemapToggle({      map : map,      basemap : "satellite"     }, "BasemapToggle");     toggle.startup();     //Add layer     var schemeBoundary = new FeatureLayer(       "http://192.168.1.234:6080/arcgis/rest/services/NIB/Ahero_Map_FeatureLayer/MapServer/10",       {        mode : FeatureLayer.MODE_ONDEMAND,        outFields : [ "*" ]       });     var settlement = new FeatureLayer(       "http://192.168.1.234:6080/arcgis/rest/services/NIB/Ahero_Map_FeatureLayer/MapServer/7",       {        mode : FeatureLayer.MODE_ONDEMAND,        outFields : [ "*" ]       });     var emptyParcel = new FeatureLayer(       "http://192.168.1.234:6080/arcgis/rest/services/NIB/Ahero_Map_FeatureLayer/MapServer/6",       {        mode : FeatureLayer.MODE_ONDEMAND,        outFields : [ "*" ]       });     var parcels = new FeatureLayer(       "http://192.168.1.234:6080/arcgis/rest/services/NIB/Ahero_Map_FeatureLayer/MapServer/5",       {        mode : FeatureLayer.MODE_ONDEMAND,        outFields : [ "*" ]       });     var irrigationBlock = new FeatureLayer(       "http://192.168.1.234:6080/arcgis/rest/services/NIB/Ahero_Map_FeatureLayer/MapServer/4",       {        mode : FeatureLayer.MODE_ONDEMAND,        outFields : [ "*" ]       });     var buildings = new FeatureLayer(       "http://192.168.1.234:6080/arcgis/rest/services/NIB/Ahero_Map_FeatureLayer/MapServer/3",       {        mode : FeatureLayer.MODE_ONDEMAND,        outFields : [ "*" ]       });     var river = new FeatureLayer(       "http://192.168.1.234:6080/arcgis/rest/services/NIB/Ahero_Map_FeatureLayer/MapServer/2",       {        mode : FeatureLayer.MODE_ONDEMAND,        outFields : [ "*" ]       });     var road = new FeatureLayer(       "http://192.168.1.234:6080/arcgis/rest/services/NIB/Ahero_Map_FeatureLayer/MapServer/1",       {        mode : FeatureLayer.MODE_ONDEMAND,        outFields : [ "*" ]       });     var canal = new FeatureLayer(       "http://192.168.1.234:6080/arcgis/rest/services/NIB/Ahero_Map_FeatureLayer/MapServer/0",       {        mode : FeatureLayer.MODE_ONDEMAND,        outFields : [ "*" ]       });     //add the legend     map.on("layers-add-result", function(evt) {      var layerInfo = arrayUtils.map(evt.layers, function(layer,        index) {       return {        layer : layer.layer,        title : layer.layer.name       };      });      if (layerInfo.length > 0) {       var legendDijit = new Legend({        map : map,        layerInfos : layerInfo       }, "legendDiv");       legendDijit.startup();      }      //add check boxes       array.forEach(layerInfo,        function(layer) {         var layerName = layer.title;         var checkBox = new CheckBox({          name : "checkBox" + layer.layer.id,          value : layer.layer.id,          checked : layer.layer.visible,          onChange : function(evt) {           var clayer = map.getLayer(this.value);           clayer.setVisibility(!clayer.visible);           this.checked = clayer.visible;          }         });         //add the check box and label to the TOC         domConstruct.place(checkBox.domNode, "toggle",           "after");         var checkLabel = domConstruct.create('label', {          'for' : checkBox.name,          innerHTML : layerName         }, checkBox.domNode, "after");         domConstruct.place("<br />", checkLabel,           "after");        });     });     map.addLayers([ schemeBoundary, settlement, emptyParcel,         parcels, irrigationBlock, buildings, river,         road, canal ]);    }); </script>

Outcomes