selectのnameが配列の場合

解決済

質問者：hap_miu
質問日時：2007/08/20 03:20
回答数：3件

説明がわかりにくいかもしれませんがよろしくお願いいたします。
　
セレクトボックスが選択されると、テキストフィールドが変わるというJavaScriptを作成しています。
nameに配列を使った場合、elementsを使用すればいいと言うことまでは分かり１つだけの場合は成功しました。
しかし、同じname(配列)のセレクトボックスとテキストフィールドが複数ある場合は成功しません。
PHPでデータベースに格納する際に、どうしてもセレクトボックスとテキストフィールドは配列にして置かないといけないのですが、この場合どうすれば、成功するでしょうか？
現在以下のようにソースを書いて失敗しています。
ご教授の程よろしくお願いいたします。

↓↓JavaScript部分
<script>
function selectChange(){
var no = document.test1.elements['member[]'].selectedIndex;
if(no==1){
document.test1.elements['point[]'].value =0;
}
else{
document.test1.elements['point[]'].value ="";
}
}
</script>

↓↓HTML部分
<form name='test1'>
<select name='member[]' onChange='selectChange()'>
<option value='aaa'>aaa</option>
<option value='bbb'>bbb</option>
<option value='ccc'>ccc</option>
</select>
<input name='point[]' type='text'>
<br>
<select name='member[]' onChange='selectChange()'>
<option value='aaa'>aaa</option>
<option value='bbb'>bbb</option>
<option value='ccc'>ccc</option>
</select>
<input name='point[]' type='text'>
</form>

//bbbの場合だけ、テキストフィールドのデフォルト値を0にしたい

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (3件)

ベストアンサー優先
最新から表示
回答順に表示

No.2ベストアンサー

回答者： steel_gray
回答日時：2007/08/20 07:25

サンプル。

（区別の為にselectChangeを呼び出すときに何番目かを渡します）

<html>
<head>
<title></title>
</head>
<script type="text/javascript">
function selectChange(ObjIndex){
if(document.getElementsByName('member[]')[ObjIndex].selectedIndex ==1){
document.getElementsByName('point[]')[ObjIndex].value ='0';
}else{
document.getElementsByName('point[]')[ObjIndex].value ='';
}
}
</script>
<body>
<form name='test1'>
<select name='member[]' onChange='selectChange(0)'>
<option value='aaa'>aaa</option>
<option value='bbb'>bbb</option>
<option value='ccc'>ccc</option>
</select>
<input name='point[]' type='text'>
<br>
<select name='member[]' onChange='selectChange(1)'>
<option value='aaa'>aaa</option>
<option value='bbb'>bbb</option>
<option value='ccc'>ccc</option>
</select>
<input name='point[]' type='text'>
</form>
</body>
</html>

- 0
- 件

通報する

この回答へのお礼

ご丁寧にありがとうございます。
No.1の方のと同様自分でもやってみて、
<option>をデータベースからループで引っ張ってくるたびに、
selectChange($ji)として、$jiをカウントしていく方法で対応出来ました。

通報する

お礼日時：2007/08/20 21:51

No.3

回答者： yambejp
回答日時：2007/08/20 09:38

セレクトボックスからどのテキストボックスにいれていいかを

idで指定してやるというのが間違いがないやりかたですね。
なお、formにnameをつけて処理するのは非推奨です。

<script language=javascript>
function selectChange(obj,id){
document.getElementById(id).value=obj.value;

}
</script>

<form>
<select name='member[]' onChange='selectChange(this,"point1")'>
<option value=''>選択してください</option>
<option value='aaa'>aaa</option>
<option value='bbb'>bbb</option>
<option value='ccc'>ccc</option>
</select>
<input name='point[]' type='text' id='point1'>
<br>
<select name='member[]' onChange='selectChange(this,"point2")'>
<option value=''>選択してください</option>
<option value='aaa'>aaa</option>
<option value='bbb'>bbb</option>
<option value='ccc'>ccc</option>
</select>
<input name='point[]' type='text' id='point2'>
</form>

- 0
- 件

通報する

この回答へのお礼

そうでした。nameではよくないですね
JavaScriptは初心者なので、自分で修正が出来なかったのですが
aaaを選択すると、テキストボックスにもaaaと表示され
それを修正出来ませんでした…
感覚的には前述のかたのお礼に投稿したようなPHPではなく、yambejpが投稿して下さったようにJavaScriptで処理した方がスマートな気がするのですがうまくいきません。もっと勉強してみます。
とても参考になりました。ありがとうございます。

通報する

お礼日時：2007/08/20 21:57

No.1

回答者： taloo
回答日時：2007/08/20 04:11

nameが同じものは配列になります。

<input type="checkbox">と同じです。

document.test1.elements['member[]'][0].selectedIndex

nameに[]をつけると配列になるとかならないとかはPHPの問題ですので、JavaScriptは関係ありません。

この回答への補足

ご回答ありがとうございます。
document.test1.elements['member[]'][0].selectedIndex
に変えてみると、1個目が動きました！
それ以降はそれぞれ、0,1,…とすればいいのでしょうが、
そのセレクトとテキストのセットはデータベースからひっぱって来ているので、何回あるか分かりません。
JavaScriptでは分からなかったので、forループで<optiopn>を引っ張ってくるたびにJavaScriptを書き込むという風にPHPで処理してみました。

for($ji=0; $col = mysql_fetch_array($rst); $ji++) {
$jschange .="
function selectChange".$ji."(){
var no".$ji." = document.test1.elements['member[]'][".$ji."].selectedIndex;
if(no".$ji."==1){
document.test1.elements['point[]'][".$ji."].value =0;
}
else{
document.test1.elements['point[]'][".$ji."].value =\"\";
}
}
";
}

もっとスマートな方法があるような気がするのですが、
ひとまずこれで動いています。
ありがとうございました