====== set selectedIndex value for dynamic drop-down list ====== 動的に作成された**select object**のoptionを設定する方法を紹介する。\\ 大まかに、動的にリストを作成する部分とoptionの値を設定する部分の二に分けて説明する。\\ 今回の例ではjavascript libraryの**dojo((現在、最新のバージョンは1.4である。))**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はselect object,valueは設定されるoptionの値である。
しかし、**ＩＥ6**だと場合によっては上記のコードが駄目になることがある。\\

確実な方法としてはdrop-downリストを作成する際に、値を設定することがある。
そのコードを次に示す。

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

{{keywords>set selectedIndex Select Object drop-down list dojo}}

===== source code =====
今回のテストで使ったソースコードを次に示す。











===== Test page =====
テストする為にページをrefreshしてください。









~~DISCUSSION~~