- ベストアンサー
ラジオボタンの選択でセレクトメニューのnameの値を変えたい
教えてください。 まず上にラジオボタンがあり、下にプルダウンメニューがあります。 選択したラジオボタンのvalueが、下のプルダウンのnameになるようにしたいです。 <select name="ここに上のラジオボタンで選択されたvalueが入るようにしたい" size="1"> <option value="all" selected>指定しない</option> <option value="あいうえお">あいうえお</option> <option value="かきくけこ">かきくけこ</option> よろしくお願いします。
- ultra-goo
- お礼率100% (4/4)
- JavaScript
- 回答数2
- ありがとう数3
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
以下のコードを参考にしてみてください。 ------------------------------------------------------------ <html> <head> <script type="text/javascript"><!-- function setSel(r) { var obj = document.getElementById("sel1"); obj.name = r.value; alert(obj.name); } //--></script> </head> <body> <form> <input type="radio" name="rad" onclick="setSel(this)" value="radio1"> radio1 </input> <input type="radio" name="rad" onclick="setSel(this)" value="radio2"> radio2 </input> <hr /> <select name="ここに上のラジオボタンで選択されたvalueが入るようにしたい" size="1"> <option value="all" selected>指定しない</option> <option value="あいうえお">あいうえお</option> <option value="かきくけこ">かきくけこ</option> </form> </body> </html>
その他の回答 (1)
- yambejp
- ベストアンサー率51% (3827/7415)
まずselectにidを振ります。 あとはクリックされたときのアクションを設定するだけです。 <script> window.onload=function(){ var f=document.getElementById("f0"); for(var i=0;i<f.length;i++){ if(f[i].name=="hoge") f[i].onclick=function(){document.getElementById('hoge').name=this.value;}; } } </script> <form id="f0"> <input type="radio" name="hoge" value="" id="none" checked><label for="none">指定なし</label> <input type="radio" name="hoge" value="aaa" id="aaa"><label for="aaa">aaa</label> <input type="radio" name="hoge" value="iii" id="iii"><label for="iii">iii</label> <select id="hoge" size="1" onchange="alert(this.name)"> <option value="all" selected>指定しない</option> <option value="あいうえお">あいうえお</option> <option value="かきくけこ">かきくけこ</option> </select> </form>
お礼
早速、感謝です！！ コピペしてためしてみます。 IDをふるという知識はなかったです。 ありがとうございます！
関連するQ&A
- セレクトメニューのリセットについて
<select name="Q1_VALUE"> <option value="1" selected >AAAA</option> <option value="2" selected >BBBB</option> <option value="3" >CCCC</option> <option value="4" >DDDD</option> </select> <select name="Q2_VALUE"> <option value="1" selected >1111</option> <option value="2" >2222</option> <option value="3" >3333</option> </select> 上記セレクトメニューでQ1_VALUEの選択肢を変更した場合Q2_VALUEの選択肢をデフォルトに戻す方法を教えて下さい。
- ベストアンサー
- JavaScript
- ラジオボタンとプルダウンで困っています。
教えてgooの質問等を参考に携帯のサイトを作っております。 どうしても分からない部分がありましたので教えてください。 日付を選択するフォームを作成しており、内容は ラジオボタンで「今日の日付」「指定日」のどちらかを選択。 「指定日」を選択した場合は「指定日」の下にプルダウンで年月日を選択できるようにしております。 今日の日付は次のページにデータを渡すことができるのに 「指定日」の年月日はどうしても次のページに渡すことができません。 <form action=comf.php method=POST> <input type=radio checked name=day value="<?php echo"".$now_date = date("Ymd").""?>">1:今日 <br> <input type=radio name=day value=○○>3:指定日 <br> <select name="year" > <option value="2006">2006</option> </select> 年 <select name="month" > <option value="01">01</option> 月 <select name="date"> <<option value="01">01</option> 日 <input type=submit value="確認画面へ"> 指定日の「value=○○」には何を入れればよろしいのでしょうか？ ご教授お願いいたします。
- ベストアンサー
- PHP
- プルダウンを選択していないときは、初期値(selected)の値を、選
プルダウンを選択していないときは、初期値(selected)の値を、選択したときは選択値を、hiddenで渡したい。 ▽プルダウン例 <form> <select> <option value="0" selected>A</option> <option value="4">B</option> <option value="6">C</option> </select> </form> ↑上で選択した値(A or B or C)値を、↓下のvalue=「"hoge"」に渡したいです。 ※選択肢は3つだけではなくて、たくさんあります。 ▽input例 <input name="category_name" value="hoge" type="hidden"> ※formとかselectにid振っても構いません。 ※javascriptでやりたいです。
- ベストアンサー
- JavaScript
- セレクトメニュー選択でもう一つセレクトメニューを出す
「ブロック名」のセレクトメニューを選択すると、選択した項目によってもう一つ「部署名」のセレクトメニューが出て選択するようにしたいと思い、途中まで作成しました。 しかし、「ブロック名」を「Ａブロック」選択しても「部署名」が「Ｂトップ～」が出てしまいます。 何がおかしいのか分からないので、ぜひ教えてください。 よろしくお願いいたします。 menuItem = [ ["Ａトップ","A本部","B本部","C本部"], ["Ｂトップ","1本部","2本部","3本部"], ["Ｃトップ","あ本部","い本部","う本部"], ["Ｄトップ","●本部","▲本部","◆本部"] ]; function setMenuItem(n) { len = document.form2.BUSYO.options.length; for (i=0; i<len; i++) { document.form2.BUSYO.options[i] = null; } document.form2.BUSYO.style.visibility = "visible"; for (i=0; i<menuItem[n].length; i++) { document.form2.BUSYO.options[i] = new Option(menuItem[n][i],menuItem[n][i]); } ---------------------------------------------------------------- <SELECT size="1" name="Block" onChange="setMenuItem(this.selectedIndex)"> <OPTION selected value="0">選択してください</OPTION> <OPTION value="a-block">Aブロック</OPTION> <OPTION value="b-block">Bブロック</OPTION> <OPTION value="c-block">Cブロック</OPTION> <OPTION value="d-block">Dブロック</OPTION> </SELECT> <SELECT size="1" name="BUSYO" style="visibility:hidden"> <OPTION selected value="0">選択してください</OPTION> </SELECT>
- ベストアンサー
- JavaScript
- selectした項目によって、radioボタンの値を変える方法
selectボックスの値によって、ラジオボタンに自動的にチェックを入れるというものを作りたいのですが、やり方がわからないのでどなたか回答をお願いします。 selectボックスは、 <select name="Q01" id="Q01"> <option selected>▼選択</option> <option value="1">Ａコース</option> <option value="2">Ｂコース</option> <option value="3">Ｃコース</option> </select> というようなものを用意しています。 ラジオボタンは、 <label for="Q02_1"> 有り<input name="Q02" type="radio" id="Q02_1" value="0" checked> </label> <label for="Q02_2"> 無し<input name="Q02" type="radio" id="Q02_2" value="1"> </label> <label for="Q03_1"> 有り<input name="Q03" type="radio" id="Q03_1" value="0" checked> </label> <label for="Q03_2"> 無し<input name="Q03" type="radio" id="Q03_2" value="1"> </label> <label for="Q04_1"> 有り<input name="Q04" type="radio" id="Q04_1" value="0" checked> </label> <label for="Q04_2"> 無し<input name="Q04" type="radio" id="Q04_2" value="1"> </label> ・ ・ ・ ・ というようなものを用意しています。 Ａコースを選ぶと、 Q02は「有り」、Q03は「無し」、Q04は「有り」 Ｂコースを選ぶと、 すべて「有り」 Ｃコースを選ぶと、 すべて「無し」 というような、コースによってラジオボタンにチェックが入るという仕組みです。 宜しくお願い致します。
- ベストアンサー
- JavaScript
- セレクトメニューからもう一つのセレクトメニューを選択したか確認
「ブロック名」のセレクトメニューを選択すると、選択した項目によってもう一つ「部署名」のセレクトメニューが出て選択するようにしました。 送信前に「ブロック名」だけでなく、「部署名」も選択したかそうか確認したのですが、どうしでも出来ません。 いろいろ試しても出来なくて困っています。 ぜひ教えてください。 よろしくお願いいたします。 ---------------------------------------------------------------- menuItem =[[" "], ["(2) 部署を選択 ","あああ","いいい"], ["(2) 部署を選択 ","ううう","えええ"], ["(2) 部署を選択 ","おおお","かかか"], ["(2) 部署を選択 ","ききき","くくく"]]; function setMenuItem(n) { len = document.form2.BUSYO.options.length; for (i=0; i<len; i++) { document.form2.BUSYO.options[i] = null; } document.form2.BUSYO.style.visibility = "visible"; for (i=0; i<menuItem[n].length; i++) { document.form2.BUSYO.options[i] = new Option(menuItem[n][i],menuItem[n][i]); } ---------------------------------------------------- <SELECT size="1" name="AREA" onchange="setMenuItem(this.selectedIndex)" style="color : #3d3d3d;"> <OPTION value="0" selected>(1) ブロックを選択 </OPTION> <OPTION value="Ａブロック">Ａブロック</OPTION> <OPTION value="Ｂブロック">Ｂブロック</OPTION> <OPTION value="Ｃブロック">Ｃブロック</OPTION> <OPTION value="Ｄブロック">Ｄブロック</OPTION> </SELECT> <SELECT size="1" name="BUSYO" style="color : #3d3d3d;visibility : hidden;"> <OPTION selected value="0"></OPTION> </SELECT> ---------------------------------------------------------------- 確認用 if(document.form2.AREA.value=="0"){ alert("ブロックを選択してください"); return false; } return true; }
- 締切済み
- JavaScript
- <input>の選択肢をプルダウンメニューから受け取り、hiddenで
<input>の選択肢をプルダウンメニューから受け取り、hiddenで渡したいのですが、どうすればよいでしょうか？ ▽プルダウン例 <FORM> <SELECT> <OPTION SELECTED>SELECT</OPTION> <OPTION VALUE="1">A</OPTION> <OPTION VALUE="2">B</OPTION> <OPTION VALUE="3">C</OPTION> </SELECT> </FORM> ↑上で選択した値(A or B or C)値を、↓下のvalue=「"hoge"」に渡したいです。 ※選択肢は3つだけではなくて、たくさんあります。 ▽input例 <input name="hosted_button_id" value="hoge" type="hidden"> http://okwave.jp/qa/q6016233.htmlの質問内容が知りたいことに近かったのですが、value値ではなくて、選択した内容そのものをhiddenへ渡す方法を教えてください。
- ベストアンサー
- JavaScript
- ボタンで選択されていないセレクトメニューの非反映２
前回、「ボタンで選択されていないセレクトメニューの非反映」という質問をさせて頂いたものです。 http://okwave.jp/qa/q7093835.html 文章構成などは下記のHTMLをしようしているのですが…。 「蓋付きのボックス」の＜ラジオボックスをチェックしなければ選択できない＞はクリアできたのですが、「蓋付きバスケット」の方で迷っています。 後はこれで合計金額がきちんと出ればいいのですが…、 もうすこしお力とお時間を頂けないでしょうか？ <html> <head> <title>簡単見積もり表</title> <script Language="JavaScript"> <!-- function calc() { n = 0; fObj = document.myFORM; n += eval(fObj.sel0.options[fObj.sel0.selectedIndex].value); n += eval(fObj.sel1.options[fObj.sel1.selectedIndex].value); for (i=0; i<3; i++) if (fObj[i].checked) n += eval(fObj[i].value); for (i=3; i<19; i++) if (fObj[i].checked) n += eval(fObj[i].value); fObj.result.value = n; } function linker(evt){ var t = evt.target || evt.srcElement; if(t.nodeName != "INPUT" || t.type != "radio") return; var sel, i, s; sel = t.form.getElementsByTagName("select"); for(i=0; s=sel[i++];) if(/(^| )linkage( |$)/.test(s.className)){ t = s.previousSibling; while(t && (t.nodeName != "INPUT" || t.type != "radio")) t = t.previousSibling; if(t) s.disabled = !t.checked; } } // --></script> </head> <body> <form name="myFORM" action="#" onclick="linker(event)"> <BR> <b>セットの果物を一つお選び下さい</b><br> <input type="radio" name="ch1" value="100">りんご（100円） <input type="radio" name="ch1" value="20">バナナ（20円） <input type="radio" name="ch1" value="200">梨（200円） <input type="radio" name="ch1" value="250">ブドウ（250円） <input type="radio" name="ch1" value="150" checked>みかん（150円）<br> <BR> <b>リボンの色をお選びください</b><br> <input type="radio" name="ch2" value="0" checked>赤（0円） <input type="radio" name="ch2" value="2000">青（0円） <input type="radio" name="ch2" value="0">金（10円）<br> <hr> <b>バスケットの形をお選び下さい</b><br> <INPUT type="radio" name="cover" value="1200" checked>プラスチック丸型編み込み\1200<INPUT type="checkbox" name="bx1" value="500">素材を木に変更（+\500）<BR> <INPUT type="radio" name="cover" value="1500">編み込み四角\1500<BR> <INPUT type="radio" name="cover" value="1500">編み込み楕円\1500<BR> <INPUT type="radio" name="cover" value="1000">蓋なしボックスレインボー1000円<br> <INPUT type="radio" name="cover" value="covered"><b>蓋付きのボックス</b> 色によって値段が変化します<br> <select class="linkage" name="color_of_cover" disabled> <OPTION value="0" selected>色を選択</OPTION> <OPTION value="39900">赤1000円</OPTION> <OPTION value="52500">青1000円</OPTION> <OPTION value="54600">金1100円</OPTION> </select><BR> <INPUT type="radio" name="cover" value="0"><b>蓋付きバスケット</b> 形によって値段が変化します<BR> <select name="sel1"> <OPTION value="0" selected>形を選択</OPTION> <OPTION value="1500">丸 1500円</OPTION> <OPTION value="1600">四角 1600円</OPTION> <OPTION value="1600">楕円 1600円</OPTION> </select> <br><hr><BR> <b>ご希望のオプションがあれば選択して下さい。（複数選択可）</b><BR> <INPUT type="checkbox" name="bx1" value="300">クッション材\300 <INPUT type="checkbox" name="bx1" value="200">飾り\200<BR> <INPUT type="checkbox" name="bx1" value="150">メッセージカード\150 <INPUT type="checkbox" name="bx1" value="2500">花束\2,500<BR> <BR> <hr> <input type="button" value="合計を出す" onClick="calc()"><br> 合計<input type="text" name="result"><br> </form> </body> </html>
- 締切済み
- JavaScript
- HTML内の指定の位置にプルダウンを読み込みたい
まずラジオボタンがあって、 選択するとfunctionに格納してあるプルダウンを ラジオボタンの下の指定した箇所に表示させたいです。 ラジオボタンを変更すると、プルダウンも変わるようにしたいです。 教えてください。お願いします。 <HTML><HEAD> <script type="text/javascript"><!-- function pulldown1(){ document.write('<select name="AAA" size="1">'); document.write('<option value="1-1" selected>1-1</option>'); document.write('<option value="1-2">1-2</option>'); document.write('</select>'); } function pulldown2(){ document.write('<select name="BBB" size="1">'); document.write('<option value="2-1" selected>2-1</option>'); document.write('<option value="2-2">2-2</option>'); document.write('</select>'); } //--></script> <style type="text/css"> </HEAD> <BODY><FORM> <INPUT type="radio" name="rdoSample" onClick="pulldown1()">タイプ１ <BR> <INPUT type="radio" name="rdoSample" onClick="pulldown2()">タイプ２ </FORM></BODY> </HTML>
- ベストアンサー
- JavaScript
- セレクトメニューの値の取得
質問します。 下記のようなセレクトメニューがあった場合に、表示されている値(AA,BB)をJavaScriptで取得する場合はどのようなコーディングをすればよろしいのでしょうか？ <select name="SL_CMB" onChange="alert();"> <option value="1" Selected>AA</option> <option value="2" >BB</option> <option value="3" >CC</option> <option value="4" >DD</option> <option value="5">EE</option> </select>
- ベストアンサー
- JavaScript
お礼
ありがとうございます！！ すごくシンプルでタグの見た目がきれいで良いですね。 早速ためしてみます。どうもです！！！