gios_asu

Combo Box Update to 3.5? PLEASE HELP!!!

Discussion created by gios_asu on Jul 10, 2013
Latest reply on Jul 10, 2013 by dcastano
I really need help to update this to 3.5...everything I try wont work.  Here is the only working solution in 1.5:


<html lang="en">
  <head>
    <meta name="generator" content="HTML Tidy, see www.w3.org">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
   
    <title>Populate dropdown list with unique values</title>
   
    <link rel="stylesheet" type="text/css"
            href="http://serverapi.arcgisonline.com/jsapi/arcgis/1.5/js/dojo/dijit/themes/tundra/tundra.css">
   
    <style type="text/css">body,html,#main{margin:0;padding:0;height:100%;width:100%;}</style>
  
    <script type="text/javascript">var djConfig = { parseOnLoad:true }</script>
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=1.5"></script>
   
    <script type="text/javascript">
      dojo.require("esri.map");
      dojo.require("esri.tasks.query");
      dojo.require("dojo.parser");
      dojo.require("dijit.layout.BorderContainer");
      dojo.require("dijit.layout.ContentPane");
      dojo.require("dijit.form.ComboBox");
      dojo.require("dojo.data.ItemFileReadStore");

      var map;
      var resizeTimer;
      function init() {
        dojo.connect(dijit.byId('map'),'resize',function() {
          resizeMap();
        });
        var queryTask = new esri.tasks.QueryTask("http://masgis2.asu.edu:6080/arcgis/rest/services/Group5/ASU_trees/MapServer/0");
       
        //Define query parameters
        var query = new esri.tasks.Query();
        query.outFields = ["TAG_C_DESC"];
        query.returnGeometry = false;
        query.where  = "TAG_C_DESC <> ''"
        queryTask.execute(query,populateList);

        var initialExtent = new esri.geometry.Extent(-111.950, 33.450,-111.917, 33.384,
                new esri.SpatialReference({wkid:4326}) );
        map = new esri.Map("map", {extent:initialExtent});

        //Create tiled and dynamic map services and add to the map - for the dynamic service set the transparency
        //and provide an id so we can access it later
        map.addLayer(new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer"));    
        map.addLayer(new esri.layers.ArcGISDynamicMapServiceLayer("http://masgis2.asu.edu:6080/arcgis/rest/services/Group5/ASU_trees/MapServer",
                {"opacity":.4,"id":"dynamic"}));
      }

      function populateList(results) {
        //Populate the dropdown list box with unique values
        var zone;
        var values = [];
        var testVals={};

        //Add option to display all zoning types to the dropdown list
        values.push({name:"ALL"})
       
        var features = results.features;
        dojo.forEach (features, function(feature) {
          zone = feature.attributes.TAG_C_DESC;
          if (!testVals[zone]) {
            testVals[zone] = true;
            values.push({name:zone});
          }
        });
       
        var dataItems = {
               identifier: 'name',
               label: 'name',
               items: values
        };
        var store = new dojo.data.ItemFileReadStore({data:dataItems});
        dijit.byId("mySelect").store = store;
      }
     
      function applyLayerDef(selItem){
        //Filter the layer to display only the selected zoning types
        if (selItem.value !== 'ALL') {
          var layerDefs = [];
          layerDefs[0] = "TAG_C_DESC = " + "'" + selItem.value + "'";
          layerDefs.visibleLayers = [0];
          map.getLayer("dynamic").setLayerDefinitions(layerDefs);
        }
        else {
          map.getLayer("dynamic").setDefaultLayerDefinitions();
        }
      }

      function resizeMap() {
        //Handle browser resize
        clearTimeout(resizeTimer);
       
        resizeTimer = setTimeout(function() {
          map.resize();
          map.reposition();
        }, 800);
      }

      dojo.addOnLoad(init);
    </script>
  </head>
  <body class="tundra">
    <div id="main"
            dojotype="dijit.layout.BorderContainer"
            design="headline"
            gutters="true">
      <div id="header"
             dojotype="dijit.layout.ContentPane"
             region="top"
             style="height:25px;">
        <select id="mySelect"
             dojotype="dijit.form.ComboBox"
             style="width:300px;font-size:18px;"
             autoComplete="true"
             forceValidOption="false"
             value="Select Common Name"
             onchange="applyLayerDef(this)"></select>
      </div>
      <div id="map"
             dojotype="dijit.layout.ContentPane"
             region="center"
             style="border:1px solid #000;margin:5px">
      </div>
    </div>
  </body>
</html>

Outcomes