set selectedIndex value for dynamic drop-down list

動的に作成されたselect objectのoptionを設定する方法を紹介する。
大まかに、動的にリストを作成する部分とoptionの値を設定する部分の二に分けて説明する。
今回の例ではjavascript libraryのdojo¹⁾frameworkを利用した。
ちなみに、テストはInternet Explorer(以下IE)７,8とFireFox(以下FF)3で行われた。

まず、動的にoptionリストを作成する部分だが、コードの一部分を次に示す。

function createOpt(label, value){
   var opt=document.createElement('option');
   opt.appendChild(document.createTextNode(label));
   opt.setAttribute('value',value);
   return opt;
}

ここで、labelはoptionのテキストで、valueはoptionの値である。

次にoptionの値を設定する部分だが、ブラウザごとに実装が違うので確認する必要がある。 IE7とFF3だと次のコードが有効である。

function setVals(obj, value){
   for(var i=0; i<obj.options.length; i++){
      if(obj.options[i].value == value){
         obj.options[i].setAttribute("selected", "true");
         break;
      }
   }
}