![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?5a7ff87)
説明がわかりにくいかもしれませんがよろしくお願いいたします。
セレクトボックスが選択されると、テキストフィールドが変わるというJavaScriptを作成しています。
nameに配列を使った場合、elementsを使用すればいいと言うことまでは分かり1つだけの場合は成功しました。
しかし、同じ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にしたい
No.2ベストアンサー
- 回答日時:
サンプル。
(区別の為に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>
ご丁寧にありがとうございます。
No.1の方のと同様自分でもやってみて、
<option>をデータベースからループで引っ張ってくるたびに、
selectChange($ji)として、$jiをカウントしていく方法で対応出来ました。
No.3
- 回答日時:
セレクトボックスからどのテキストボックスにいれていいかを
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>
そうでした。nameではよくないですね
JavaScriptは初心者なので、自分で修正が出来なかったのですが
aaaを選択すると、テキストボックスにもaaaと表示され
それを修正出来ませんでした…
感覚的には前述のかたのお礼に投稿したようなPHPではなく、yambejpが投稿して下さったようにJavaScriptで処理した方がスマートな気がするのですがうまくいきません。もっと勉強してみます。
とても参考になりました。ありがとうございます。
No.1
- 回答日時:
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 =\"\";
}
}
";
}
もっとスマートな方法があるような気がするのですが、
ひとまずこれで動いています。
ありがとうございました
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript 以前の質問だと、どの条件でも配列が表示されてしまいます。 1 2022/07/09 11:40
- JavaScript セレクトボックスを2つ選択してメッセージなどを表示するには。~運賃検索プログラムを完成させたい~ 1 2022/07/22 11:10
- JavaScript セレクトボックスで配列を呼び出したい。 1 2022/07/08 20:14
- JavaScript JavascriptからSQLへ繋ぎ方が分からない 3 2022/07/07 00:27
- JavaScript sessionStorageを調べています。 1 2023/06/20 12:41
- JavaScript console.logがどうしても2つ機能しないのでアドバイスをくださいお願いします 2 2022/07/07 22:13
- JavaScript switch文のswitch(n)の部分を複数の値にするか、if文に変えてほしいです。 1 2022/07/27 17:18
- JavaScript 2段階プルダウンで1段階目の選択を終えた後に選択ボックスを見えなくしたい 2 2022/07/05 21:58
- JavaScript セレクトボックスを2つ設けて選択して初めてメッセを表示 1 2022/07/27 12:15
- JavaScript セレクトを全て選択されていないと、文字によるエラーメッセージを表示させるコードを調べています 2 2023/06/22 15:48
関連するカテゴリからQ&Aを探す
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
セレクトボックスで配列を呼び...
-
プルダウン選択を変更すると、...
-
addclassがうまく働きません
-
一緒のプルダウンメニューを同...
-
プルダウンメニューに連動する...
-
selectボックスの選択結果を変...
-
return falseが効かない
-
連想配列を使ってコンボボック...
-
プルダウンの値によって活性・...
-
複数のプルダウンメニューの組...
-
javascript-変数がよくわかりま...
-
jqueryでselect要素を表示・非...
-
子ウインドウから親ウインドウ...
-
複数プルダウンで検索
-
2つのセレクトボックスで選ば...
-
selectを変更不可にしたい
-
Selectボックスの一覧表示方法
-
同一IDで個数を分けたい。
-
ラジオボタンの値が取得できな...
-
リストボックス内の重複したも...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
プルダウン選択を変更すると、...
-
selectを変更不可にしたい
-
javascriptでセレクトボックス...
-
全てのselect要素をデフォルト...
-
Selectボックスの一覧表示方法
-
リストボックス内の重複したも...
-
プルダウンの値によって活性・...
-
VBScriptでHTMLのセレクトボッ...
-
JavaScriptで<select>の<option...
-
セレクトボックスで配列を呼び...
-
ラジオボタンとプルダウンを連...
-
selectを使った計算
-
select要素のvalueを配列で取得...
-
<input>の選択肢をプルダウンメ...
-
javascriptでoptionタグを削除...
-
今日の日付を自動的にセレクト...
-
検索窓とプルダウンメニュー機...
-
【javascript】連想配列からセ...
-
selectボックスの選択結果を変...
-
同じ名前のセレクトがある場合...
おすすめ情報