4

Hi there Dojo developers, I have a drop down form.select, and it has few options, how do set an option to be selected. Say I want to have the third option displayed in the select element. I was looking at the dojo docs and I do not see setSelected() or similar.

Thanks

setlio
  • 726
  • 2
  • 13
  • 32
  • 2
    try `selectWidget.set('value', your_option_value)` inside – Sergii Stotskyi Aug 22 '12 at 16:58
  • Thanks serjio, it is attr, but you gave me the right direction, found answer here : http://stackoverflow.com/questions/2215979/setting-the-value-selected-option-of-a-dijit-form-select-widget – setlio Aug 22 '12 at 17:26
  • it's not important. The main thing is that it was helpful for you, enjoy ;) – Sergii Stotskyi Aug 22 '12 at 21:16
  • Strange just realize that to pull the selected option I have to reselect it from the drop own. Basically it sets the selected option only visually, when I try to get it programmatically it does not return the one visually selected but the first on the list. – setlio Aug 24 '12 at 00:20

3 Answers3

2

You need to use displayedValue property in addition to value to set the displayed option. Use something like:

selector.set("displayedValue", "the_text_of_the_option");

or you can search the underlying store of your drop down by using :

selectorStore.fetch({query:{id: value}, onComplete: function (items) {
              dojo.forEach(items, function(item){
                  selector.set("displayedValue", "the_text_of_the_option");
                  selector.set("value", "the_value_of_the_option");
              });
}});

Hope that helps.

  • Thank you, this is true and working and put me in the right path. I have tested it. However i discovered my bug and implemented different solution. Below: – setlio Aug 24 '12 at 23:04
1

I found it, it is selector.attr("value", "the_name_of_the_option");

setlio
  • 726
  • 2
  • 13
  • 32
  • 4
    Actually in Dojo 1.7+ attr() is [deprecated](http://dojotoolkit.org/reference-guide/1.7/dojo/attr.html#id4) in favor of get() and set(). – xqwzts Aug 22 '12 at 19:07
1

Thank you, this is true and working. I have tested it. However i discovered my bug: I was creating the options dynamically, and when I set .selected = true as soon as I add it to the selector it changes the sated to the first one being selected. Or if I apply selector.set("displayedValue", "the_text_of_the_option"); It displays visually the selected one but in fact behind the selected is still the first one does not meter if I change it with the above selector.set. So I solved it by manually creating the selected state. This way when I add it letter id stays in the desired one and changes it accordingly.

Snipped here:

    //populate latitude selector
    match = false;
    optionsArr = [];
    for(var i = 0; i < namesLength; i++){
        for(var j = 0, len2 = latNames.length; j < len2; j++){
            if(fieldNames[i].toLowerCase() == latNames[j]){

                for (var a = 0; a < namesLength; a++) {
                    var option = {};
                    option.label = fieldNames[i];
                    option.value = i+"";
                    if(i==a){
                        option.selected = true;
                    }
                    optionsArr.push(option);
                }
                    match = true;
            }
        }
    }
    if(match){
        var drop1 = dijit.byId("selectLatitude");
        drop1.addOption(optionsArr);
    }else{
        var drop1 = dijit.byId("selectLatitude");
        drop1.addOption(options);//options is an array of options created originally
    }
setlio
  • 726
  • 2
  • 13
  • 32