- 締切済み
入力フォームでのIF文
現在、入力フォームを作っているのですが、思った動作にならず、たいへん苦慮しております。どなたか良きアドバイスいただけますと幸いでございます。 ＜内容＞ ベースの素材選択部分でで◆オリジナル素材を選択した場合のみ、次のベースカラーの選択でオリジナルしか選択できない様にしたい。 うまく動作せず困り果てています。 どなたかご教授いただけますとたいへん助かります。 どうぞ宜しくお願い致します。 ********************************************************** 以下がうまく動作しないソースです。 ********************************************************** ◆ベースの素材を選んでください<br> <select name="base_material" onChange="javascript:test();"> <option selected>◆ラバー起毛素材</option> <option>◆オリジナル素材</option> <option>◆ジャージ起毛素材</option> <option>◆ジャージ素材</option> </select><br> ベースカラー<BR> <select name="aaa"> <option selected>◆青色</option> <option>◆オリジナル</option> <option>◆赤色</option> <option>◆白色</option> </select> <SCRIPT Language="JavaScript"> function test() { if (document.getElementsByName("base_material")[0].selectedIndex == 1) { document.getElementsByName("aaa").item(0).value = "◆オリジナル"; } else { document.getElementsByName("aaa")[0].style.backgroundColor="white"; } } </SCRIPT>
- syarunet
- お礼率33% (1/3)
- Java
- 回答数1
- ありがとう数2
- みんなの回答 （1）
- 専門家の回答
みんなの回答
- Yanch
- ベストアンサー率50% (114/225)
若干面倒な方法ですが、解決例です。 ==================== <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <script type="text/javascript"> <!-- function test() { if (document.getElementsByName("base_material")[0].selectedIndex == 1) { obj = document.getElementsByName("aaa").item(0); obj_form = document.getElementById("formid1"); // ●行数が１行のselectを作成し、置き換え。 newSelect = document.createElement("select"); newSelect.setAttribute("name", "aaa"); newSelect.appendChild(document.createElement("option")); obj_form.replaceChild(newSelect, obj); obj = document.getElementsByName("aaa").item(0); // ●optionの最初の内容を"◆オリジナル"に変更。 obj.options[0].text = "◆オリジナル"; // ●optionの最初の内容を選択。 obj.options[0].selected = true; } else { document.getElementsByName("aaa")[0].style.backgroundColor="white"; obj_form = document.getElementById("formid1"); obj = document.getElementsByName("aaa").item(0); save_value = obj.value; // ●行数が４行のselectを作成し、置き換え。 newSelect = document.createElement("select"); newSelect.setAttribute("name", "aaa"); newSelect.appendChild(document.createElement("option")); newSelect.appendChild(document.createElement("option")); newSelect.appendChild(document.createElement("option")); newSelect.appendChild(document.createElement("option")); obj_form.replaceChild(newSelect, obj); obj = document.getElementsByName("aaa").item(0); obj.options[0].text = "◆青色"; obj.options[1].text = "◆オリジナル"; obj.options[2].text = "◆赤色"; obj.options[3].text = "◆白色"; obj.value = save_value; } } // --> </script> </head> <body> <table border="1"> <tr> <td> <form id="formid1" action="http://localhost/test" method="post"> ◆ベースの素材を選んでください<br> <select name="base_material" onChange="test();"> <option selected>◆ラバー起毛素材</option> <option>◆オリジナル素材</option> <option>◆ジャージ起毛素材</option> <option>◆ジャージ素材</option> </select><br> ベースカラー<BR> <select name="aaa"> <option selected>◆青色</option> <option>◆オリジナル</option> <option>◆赤色</option> <option>◆白色</option> </select> <br> <input type="submit" value="送信"> </form> </td> </tr> </table> </body> </html>
関連するQ&A
- 入力フォーム内でのIF文
入力フォームセレクトボタンで◆ラバー素材を選択した時のみ、カラーに青色をセットしたい。 以下の様に入力フォームを作成しましたが、なかなか上手く動作せずたいへん困っております。 どなたかご教授いただけますと幸いでございます。 <FORM action="postmail.cgi" method="POST"> 素材を選んでください<br> ◆ベースの素材を選んでください<br> <select name="◆ベースの素材"> <option selected>◆ラバー起毛素材</option> <option>◆ラバー素材</option> <option>◆ジャージ起毛素材</option> <option>◆ジャージ素材</option> </select> <SCRIPT Language="JavaScript"> $name = $_POST["◆ベースの素材"]; if ($name == "◆ラバー素材") { <INPUT type="text" name="カラー" size="79" value="青色"><BR> } </SCRIPT>
- 締切済み
- Java
- WEBの入力フォームにある<OPTION value=""> に値を入れたい
お世話になります。 VBA でWEBの入力フォームにある<OPTION value=""> に値を入れたいのですがどのようにすればよいでしょうか？ 手でするには「選択」ボタンを押したら (1)選択ボタンを押す前 <SELECT NAME="selectid" SIZE="10" multiple> <OPTION value=""> </SELECT> (2)選択ボタンを押した後 <SELECT NAME="selectid" SIZE="10" multiple> <OPTION VALUE="251">ＡＡ <OPTION value=""> </SELECT> 選択ボタンを押さずにＶＢＡでどのようにすれば、 (2)の状態になるのでしょうか？ ※objIE.Document.getElementsByName("selectid")(0).Value =”251” だとエラーが出ます。 お手数ですがよろしくお願いします。
- ベストアンサー
- Visual Basic
- 他のFormの入力内容により、Selectの状態を変化させたい
Formの状態を他のFormの入力によって変化させたいのですが。 イメージ的には <Script language="Javasript"> function data1() { document.forms[1].elements[0].value=document.test.i.value; } function data2() { document.forms[2].elements[0].options[document.test.i.value].selected=ture; } </script> 入力<br> <form name="test"> <input type="text" name="i" onKeyDown="javascript:if(event.keyCode==9){ data1();data2(); }" > </form><br><br> テキスト<br> <form> <input type="text"> </form><br><br> セレクト<br> <form> <select> <option>0 <option>1 <option>2 <option>3 </select> </form><br><br> こんな感じです。 これで、タブキーを押せば、「入力」Formに入力された内容が、関数data1()によって「テキスト」Formにも表示されます。 これと同じように、「入力」Formに入力された内容で、「セレクト」Formを変化させたいと思いますが、data2()エラーになり上手く動作しません。 「入力」Formに1を入力すれば、「セレクト」Formの1が選択された状態になる… と言った事をしたいのですが、どうすればいいでしょうか？
- ベストアンサー
- JavaScript
- 生年月日・年月日のフォームが表示されない
お世話になります。 下記のタグでは、表示されません。 サーバーの問題なのか、タグの問題かわかりませんので、 まず、タグを見て頂けませんか？ よろしくお願いします。 ------------------------------------------------ <td width="30%">生年月日</td> <td width="70%"><script type="text/javascript"> document.write("<select name=\\"296643_year\\">"); for(i=1900;i<2010;i++){ if(i==1950){ document.write("<option value="+i+" selected>"+i+"</option>"); }else{ document.write("<option value="+i+">"+i+"</option>"); } }document.write("</select>"); document.write(" 年 "); document.write("<select name=\\"296643_month\\">"); for(i=1;i<13;i++){ if(i==1){ document.write("<option value="+i+" selected>"+i+"</option>"); }else{ document.write("<option value="+i+">"+i+"</option>"); }} document.write("</select>"); document.write(" 月 "); document.write("<select name=\\"296643_day\\">"); for(i=1;i<32;i++){ if(i==1){ document.write("<option value="+i+" selected>"+i+"</option>"); }else{ document.write("<option value="+i+">"+i+"</option>"); }}document.write("</select>"); document.write(" 日 "); </script> <br><font size="1"></font></td> </tr> <tr> ---------------------------------------------------------------- <td width="30%">電話の場合の日時</td> <td width="70%"> <script type="text/javascript"> document.write("<select name=\\"296652_year\\">"); for(i=2009;i<=2010;i++){ if(i==2009){ document.write("<option value="+i+" selected>"+i+"</option>"); }else{ document.write("<option value="+i+">"+i+"</option>"); } } document.write("</select>"); document.write(" 年 "); document.write("<select name=\\"296652_month\\">"); for(i=1;i<13;i++){ if(i==4){ document.write("<option value="+i+" selected>"+i+"</option>"); }else{ document.write("<option value="+i+">"+i+"</option>"); } } document.write("</select>"); document.write(" 月 "); document.write("<select name=\\"296652_day\\">"); for(i=1;i<32;i++){ if(i==23){ document.write("<option value="+i+" selected>"+i+"</option>"); }else{ document.write("<option value="+i+">"+i+"</option>"); }} document.write("</select>"); document.write(" 日 "); document.write("<select name=\\"296652_hour\\">"); for(i=0;i<24;i++){ if(i==0){ document.write("<option value="+i+" selected>"+i+"</option>"); }else{ document.write("<option value="+i+">"+i+"</option>"); } } document.write("</select>"); document.write(" 時 "); document.write("<select name=\\"296652_minute\\">"); for(i=0;i<60;i=i+5){ if(i==0){ document.write("<option value="+i+" selected>"+i+"</option>"); }else{ document.write("<option value="+i+">"+i+"</option>"); }} document.write("</select>"); document.write(" 分 "); </script><br><font size="1"></font></td> </tr> <tr>
- ベストアンサー
- HTML
- HTMLのフォームをHDMLに変換するソフトってありますか？
以下のような一般的なフォームで、 単一選択結果を同じ画面に表示したいのですが どうすれば良いでしょうか？ 単純なHDMLの例はインターネット上に落ちていますが少しだけ複雑になるとの例がないようです。。 HTML->HDMLに変換してくれるソフトはないでしょうか？ ■一番好きな動物と度合いを選択してください <form name="fm" action="test.cgi" method="get"> <select name="a"> <option value="1">りす <option value="2" selected>たぬぼう <option value="3" selected >いぬ </select> <br> <select name="love"> <option value="1" selected>好き <option value="0" >大好き </select> </form>
- ベストアンサー
- その他（プログラミング・開発）
- 入力フォームでdisabledによる入力制限
プルダウンをdisabledで制御しようと思っています。 yearを選択するまでmonthを無効にしたいのですが、うまくいきませんでした。 下記の簡略化したソースでも動作しませんでした。 テストでwindow.openを入れると動作するので、document...の文かとは思うのですが。 どなたかお気づきでしたら、お教え下さい。 よろしくお願い致します。 <html> <head> <title>inputtest</title> <SCRIPT LANGUAGE="JavaScript"> function menu_ctrl(){ var sel_num = document.sel_inp.year.selectedIndex; if(sel_num == 0){ document.sel_inp.month.disabled = false; // window.open("http://www.google.co.jp/"); } } </SCRIPT> </head> <body onload="menu_ctrl()"> <form name="sel_inp"> <select name="year" onchange="menu_ctrl()"> <option value="00" style="color:#AAAAAA">null</option> <option value="01">2007</option> <option value="02">2008</option> <option value="03">2009</option> </select> <select name="month"> <option value="00" style="color:#AAAAAA">null</option> <option value="01">1</option> <option value="02">2</option> <option value="03">3</option> </select> </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
- 入力チェック
下記の入力チェックのときに「【選択して下さい】」という文字列なら「だめ」と表示したいのですが、項目が多いのでヘッダー部分でdocument.kansou.yubin.valueのようのようにテキストボックスの名称を１個ずつ指定せずに一括でできないでしょうか。イメージとしてはdocument.kansou.form(i).valueみたいな？感じのまとめ処理がしたいのですが。 現在→yubinが「【選択して下さい】」ならダメ jusho1が「【選択して下さい】」ならダメ ・・・・ やりたいこと→どれかのテキストボックスが「【選択して下さい】なら「だめ」 <HTML> <HEAD> <TITLE>入力チェック</TITLE> <SCRIPT LANGUAGE="JavaScript"> <!-- function submitCheck(){ if (document.kansou.yubin.value=="【選択して下さい】"){ alert("だめ"); return false; } else return true; } //--> </SCRIPT> </HEAD> <BODY> <FORM NAME="kansou" ACTION="test.cgi" METHOD="post" ENCTYPE="text/plain" onSubmit="return submitCheck()"> <SELECT NAME="yubin">【選択して下さい】 <OPTION SELECTED>ほげほげ</OPTION></SELECT> <SELECT NAME="jusho">【選択して下さい】 <OPTION SELECTED>ほげほげ</OPTION></SELECT> <SELECT NAME="jusho2">【選択して下さい】 <OPTION SELECTED>ほげほげ</OPTION></SELECT> <INPUT TYPE="submit" VALUE="送 信" onClick="document.kansou.name.value=''"> </CENTER> </FORM> </BODY> </HTML>
- ベストアンサー
- JavaScript
- ２つのセレクトボックスで選ばれた結果をショッピングカートに渡したい
同一ページ内に次の様な２つのセレクトボックスが有ります。 それぞれ選択された内容を足してショッピングカートに送りたいのですがどうしたら良いのでしょうか？ セレクトボックス１ <option value="aaa">aaa</option> <option value="bbb">bbb</option> <option value="ccc" selected="selected">ccc</option> セレクトボックス２ <option value="100">100</option> <option value="200">200</option> <option value="300" selected="selected">300</option> ●セレクトボックス１→aaaを選択 セレクトボックス２→100を選択 ショッピングカートには「aaa100」で渡す ●セレクトボックス１→cccを選択 セレクトボックス２→200を選択 ショッピングカートには「ccc200」で渡す 全くの初心者ですがよろしくお願いします。
- 締切済み
- JavaScript
- 入力フォームの文字の大きさとフォント種類を表示させたい
入力フォームの文字の大きさとフォント種類を 確認ボタンで画面上に表示させたいのですが、エラーになってしまいます。また、文字の大きさは反映されますが、フォントの種類は反映されません。どのようにすればいいでしょうか？ <HTML> <HEAD> <STYLE type="text/css"> <!-- INPUT {font-size: 12px;} --> </STYLE> <SCRIPT language="JavaScript"> <!-- // フォームの文字の大きさと種類を変更 function sizeTxt(n){ document.nForm.textN.style.fontSize = n.options[n.selectedIndex].value + "px"; } function fontTxt(n){ document.nForm.textN.style.fontFamily = n.options[n.selectedIndex].value; } function check(){ var strName; strName = document.nForm.textN.value; var test = document.getElementById("test"); test.innerHTML = strName; var strName2; strName2 = document.nForm.textN.value; var test2 = document.getElementById("test2"); test2.innerHTML = strName2; var size = document.nForm.sizeSelect; test.style.fontSize = size.options[size.selectedIndex].value + "px"; var element = document.nFORM.fontSelect; test2.style.fontFamily = element.options[element.selectedIndex].value; } </SCRIPT> </HEAD> <BODY> <FORM name="nForm" > フォントサイズを選択できます。<br> <SELECT onChange="sizeTxt(this)" name="sizeSelect"> <OPTION value="8">8px</OPTION> <OPTION value="10">10px</OPTION> <OPTION value="12" selected>12px</OPTION> <OPTION value="16">16px</OPTION> <OPTION value="20">20px</OPTION> <OPTION value="24">24px</OPTION> <OPTION value="30">30px</OPTION> </SELECT><br><br> フォント種類を選択できます。<br> <SELECT onChange="fontTxt(this)" name="fontSelect"> <OPTION value="ＭＳ ゴシック">ゴシック</OPTION> <OPTION value="ＭＳ 明朝" selected>明朝</OPTION> </SELECT><BR><BR> <INPUT type="text" size="45" name="textN"><BR> <input type="button" value=" 確認 " onClick="check()"> </FORM> <DIV id="test" id="test2" id=text style="position:absolute;font-size:24px;font-family: Verdana, sans-serif;"> </DIV> <SCRIPT language="JavaScript"> </SCRIPT> </BODY> </HTML>
- ベストアンサー
- JavaScript
お礼
ありがとうございます。 たいへんわかりやすく説明いただき非常に助かりました。 流石でございます。