dom.byId won't parse

1021
12
Jump to solution
05-15-2014 10:47 AM
williamcarr
Occasional Contributor II
Greetings,

I assume that this is a parsing issue, but I can't be for the life of me figure how.

     var option= dom.byId("selectfield");    var optionValue = option.options[option.selectedIndex].value;    console.log(optionValue);                     if (optionValue == "ON"){map.centerAndZoom(pt, 12);}   else {}  }


This is the section that is causing me grief. When I remove parser.parse();  the function runs fine. The problem is all of my title panes and content panes get thrown totally out of whack. Without it I'm getting " option.selectedIndex is undefined".

I'm using this a dropdown to toggle the center and zoom of a watch ID.

Anyone know what might be causing this?
0 Kudos
1 Solution

Accepted Solutions
JeffPace
MVP Alum
var option= registry.byId("selectfield");
   var optionValue = option.value;
   console.log(optionValue);
        }
       

http://jsfiddle.net/v2shP/7/

View solution in original post

0 Kudos
12 Replies
JonathanUihlein
Esri Regular Contributor
Make sure to include the dojo modules you are using in your require block (BorderContainer, ContentPane, TitlePane, Menu, MenuItem, DropDownSelect etc).

If this doesn't work, you can always create a jsfiddle that showcases your issue; I would be glad to take a look.
0 Kudos
williamcarr
Occasional Contributor II
Thanks for taking a look. This fiddle doesn't include the majority of the code just the geolocation. The code works as expected but when combine with the parser.parse(); I get the error.http://jsfiddle.net/thebillcarr/v2shP/1/
0 Kudos
JeffPace
MVP Alum
I was able to add parser.parse() to yours

http://jsfiddle.net/v2shP/5/

you must also use ready. 

but i am not sure what to do after that
0 Kudos
williamcarr
Occasional Contributor II
That fixed the content panes, but now the dom.byId  isn't running its if statement. I tried it on a tablet and it will run the zoomToLocation function. The showLocation function is also running, but the IF statement is not going through when I add the code to the rest of my application.
   addGraphic(pt);
       
          var option= dom.byId("selectfield");
   var optionValue = option.options[option.selectedIndex].value;
   console.log(optionValue);
          

        if (option.value == "ON"){map.centerAndZoom(pt, 12);}
  else {}


Am I going about this wrong? Is there a different way to toggle map.centerAndZoom?
0 Kudos
JeffPace
MVP Alum
option is your dom element, shouldnt you be using optionValue in your if?
0 Kudos
JeffPace
MVP Alum
or, since selectfield is a dijit.form.select,

you could do

registry.byId('selectfield').value to get the dijit value (instead of the dom element)
0 Kudos
williamcarr
Occasional Contributor II
Correction, I did have optionValue in my IF when I got it to work on it's own(not sure why I changed it).
I tried the registrybyId and it threw the same console error "option.selectedIndex is undefined".
   var option= dom.byId("selectfield");
   var optionValue = option.options[option.selectedIndex].value;
   console.log(optionValue);

        if (optionValue == "ON"){map.centerAndZoom(pt, 12);}
  else {}


I'm not sure why this conflicted with the parser, but I'm wondering now if it doesn't have something to do with
<select data-dojo-type="dijit/form/Select" class="field" name="selectfield" id="selectfield">
    <option value="ON">TRACKING ON</option>
  <option value="OFF">TRACKING OFF</option>
  </select>


I'm at a loss. Can you think of a work around?
0 Kudos
JeffPace
MVP Alum
var option= registry.byId("selectfield");
   var optionValue = option.value;
   console.log(optionValue);
        }
       

http://jsfiddle.net/v2shP/7/
0 Kudos
MatthewLofgren
Occasional Contributor
It doesn't look like dom is defined in the fiddle?

require([
        "esri/map", "esri/geometry/Point", 
        "esri/symbols/SimpleMarkerSymbol", "esri/symbols/SimpleLineSymbol",
        "esri/graphic", "esri/Color", "dojo/domReady!"
      ], function(
        Map, Point,
        SimpleMarkerSymbol, SimpleLineSymbol,
        Graphic, Color
      ) {


try

require([
        "dojo/dom", "esri/map", "esri/geometry/Point", 
        "esri/symbols/SimpleMarkerSymbol", "esri/symbols/SimpleLineSymbol",
        "esri/graphic", "esri/Color", "dojo/domReady!"
      ], function(
        dom, Map, Point,
        SimpleMarkerSymbol, SimpleLineSymbol,
        Graphic, Color
      ) {
0 Kudos