WEB相談室

Webページ作成に関しての何でも掲示板です。

タイトル:selectboxのoptionに持っているvalue以外の値を表示したい

0:[投稿] マーチ [2004/02/20 11:32 ][環境:IE6 Windows]

はじめまして。
(DynamicHTMLの質問だと思います。)

selectboxのoptionタグにvalue以外に値を2つ持たせて、選択された項目によって、動的にページ内にその2つの値を表示したいと考えています。
1つはtextbox内に、もう1つは直接表示する必要があります。
textboxへの表示はできるのですが、直接表示の方法がわからなくて困っています。
(そもそもtextboxへの表示は、既に使用している機能で、そのままコピーしただけなので・・・)
とりあえず、2つともtextboxの場合には、以下の方法で実現できています。

<SELECT name=NAME_1 onChange='this.form.NAME_a.value=this[this.selectedIndex].title;this.form.NAME_b.value=this[this.selectedIndex].title2'>
<OPTION value="A" title="B" title2="C">A</OPTION>
<OPTION value="AA" title="BB" title2="CC">AA</OPTION>
</SELECT>
<INPUT type=text name=NAME_a>
<INPUT type=text name=NAME_b>

textboxには、名前がつけられるので、指定ができて、valueに入れられるけれど、そのまま表示だとどうするのでしょう・・・?
よろしくお願いします。


1:[回答] ミツ [2004/02/20 12:59 ]

http://www.parkcity.ne.jp/~chaichan/src/javascdom01.htm#change
この辺りの解説が役立つかと思います。


2:[質問] マーチ [2004/02/23 10:40 ]

ミツさんありがとうございました。直接表示を実現することができました。
さて、さらに質問で申し訳ないのですが、直接表示した内容を次の画面で使用するために、隠し項目として、hiddenタグのvalueに入れたいと考えています。
教えていただいた説明にある、属性の変更でできるかと思ったのですが、「オブジェクトでサポートされていないプロパティまたはメソッドです。」といわれてしまいます。
以下のようなものを書いてみたのですが、全く違うのでしょうか?よろしくお願いします。

<SELECT onChange='test(this[this.selectedIndex].title2)'>

<OPTION value="A" title="B" title2="C">A</OPTION>
</SELECT>
<INPUT type=hidden name="test" id="sys_c2" value=" ">

<script type="text/javascript">
<!--

function test(val)
{
 node = document.getElementById('sys_c2');
 node.setAttribute('sys_c2',val);
}

// -->
</script>


3:[回答] gun [2004/02/23 11:12 ]

node.value=val;


4:[質問] マーチ [2004/02/23 14:50 ]

gunさんありがとうございます。
以下のように変更してみたのですが、同じエラーのままで解決できませんでした・・・

node = document.getElementById('sys_c2');
node.value=val


5:[回答] AC [2004/02/23 20:03 ]

select要素のonchange属性のスクリプト中のthisは、select要素自身です。
option要素ではありません。
select要素の子のoption要素をDOMでアクセスするには、option属性を
使います。
this.options[0]

DOM level 1におけるselect要素のインターフェイスは、以下を参照。
http://www.doraneko.org/misc/dom10/19981001/level-one-html.html#ID-94282980


6:[関連] マーチ [2004/02/24 09:11 ]

ACさん、ありがとうございます。
ただ、optionの値をtextboxに表示したり、画面に直接表示したりはできているので、
onChange='test(this[this.selectedIndex].title2'
で、「このselectboxの選択項目のtitle2」くらいの意味で、引数に入れるtitle2の値は取得できていると思っているんですけど・・・
その値を、hiddenタグのvalue値に入れたいんです。よろしくお願いします。


7:[回答] gun [2004/02/24 09:49 ]

> 3
では、よく読まないで誤回答し、混乱させてすみません。

selectedIndex
をキーワードにして、WEB相談室の検索で検索してみてください。


8:[完了] マーチ [2004/02/24 11:22 ]

ありがとうございました。
解決しました。
考えてみれば、hiddenタグには名前をつけられるので、最初にできていたtextboxに表示したのと同じ方法で実現できました。
ブラウザ上でソースを表示した時に、valueに値が入らないので、できていないと思い込んでいました。

回答(必須): 状態:

お名前(必須):

e-mail:

URL:




[戻る]

ChaichanPAPA's World