- 締切済み
javascriptでのアラート表示
javascriptで大変困っております。 ラジオボタン・テキストエリアにまたがったチェックアラートをだしたいのですが、うまくいきません。 <script> function form_check(f) { if (f.Q1.value == "") { alert("・未記入です！"); return false; } ・ ・ ・ if (f.Q6.value == "") { alert("・名前が未記入です！"); return false; } else return true; } function reset_conf() { if (confirm("フォーム内容をリセットします！\n\nよろしいですか？")) return true; else return false; } </script> -------- <FORM ACTION="hogehoge.cgi" METHOD="POST" onSubmit="return form_check(this)"> 教育:<INPUT TYPE="radio" NAME="Q1" VALUE="OK"> テスト:<INPUT TYPE="radio" NAME="Q2" VALUE="OK"> アンケート:<INPUT TYPE="radio" NAME="Q3" VALUE="OK"> AAA:<input name="Q4" type="text" /> BBB:<input name="Q5" type="text" /> CCC:<input name="Q6" type="text" /> <INPUT TYPE="hidden" NAME="number" VALUE="6"> <INPUT TYPE="submit" NAME="answer" VALUE="送信する"> <INPUT TYPE="reset" NAME="reset" VALUE="リセット"> </FORM> </form> ------- テキストエリアのアラートチェックは出来ない状態です。 すべてにチェックまたは、テキスト入力がされていないと送信できないようにしたいのです。 どうしたらよいでしょうか？
- yyyooo1029
- お礼率33% (20/59)
- JavaScript
- 回答数1
- ありがとう数3
- みんなの回答 （1）
- 専門家の回答
みんなの回答
- fujillin
- ベストアンサー率61% (1594/2576)
テキストボックスが未記入かどうかのチェックはわかるけれど、ラジオボタンはどうしたいのでしょうか？ ラジオボタンがそれぞれ独立してしまっているので、一度押すとキャンセルはできないようになっちゃうはずだけど？ 単独でオン・オフする場合は、チェックボックスを使うべきでは？ …というか、必ずチェックされなければならないものを、ユーザに全部チェックさせるのかなぁ？ （チェックがなければ受付ないのだから、「同意する/しない」みたいな1個ですみそう） なお、ラジオボタンの場合はvalueではなくてcheckedで調べましょう。 （valueだとタグ内に記してある"OK"が返ってくるだけ） やりたいことがわかるHTMLを提示すれば、回答しやすいと思うのですが・・・ まぁ、とりあえずそのままで、全項目チェック（or入力）されていなければfalseを返したいというのであれば、 （参考までに） <html> <head> <script type="text/javascript"> function form_check(f) { var ttl = '教育,テスト,アンケート,AAA,BBB,CCC'.split(','); var i, mes = '', elm = f.elements; for (i=0; i<ttl.length; i++) if ((i<3 && !elm[i].checked)||(i>2 && elm[i].value == '')) { mes += '\n' + ttl[i] + 'が未入力です'; } if (mes.length) { alert(mes.substring(1)); return false; } else { return true; } } </script> </head> <body> <form action="#" method="POST" onsubmit="return form_check(this);"> 教育:<input type="radio" name="Q1" value="OK"> テスト:<input type="radio" name="Q2" value="OK"> アンケート:<input type="radio" name="Q3" value="OK"> AAA:<input name="Q4" type="text"> BBB:<input name="Q5" type="text"> CCC:<input name="Q6" type="text"> <input type="hidden" name="number" value="6"> <input type="submit" name="answer" value="送信する"> <input type="reset" name="reset" value="リセット"> </form> </body> </html>
関連するQ&A
- 未入力のラジオボタンに、alertを表示したい。
過去問を見て、応用しようとしましたがうまくゆきません。 超初心者ですので・・・ すいません、質問させてください。 WinXP、IE6を使っています。 下記のソースコード(簡略化しています)で、未入力の場合テキストではalertが表示されるのですが、ラジオボタンでは表示されません。 どう記述すれば表示されるのでしょうか？ お分かりの方、教えてください。 よろしくお願いします。 <html> <head> <title>お申し込み</title> <script language="JavaScript"> <!-- function checkSubmit() { if (document.form1.Name.value == "") { alert("お名前をご入力ください！"); return false; } if (confirm("この内容で送信します。\nよろしいですか？") == false) { return false; } return true; } //--> </script> </head> <form name="form1" method="post" action="http://www.000/" onSubmit="return checkSubmit()"> お名前：<input type="text" name="Name" size="20"> 男性<input type="radio" name="Seibetu" value="Man"> 女性<input type="radio" name="Seibetu" value="Woman"> <input type="submit" value="お申し込み"> </form> </body> </html>
- ベストアンサー
- JavaScript
- プルダウンメニューのvalue値が00のときアラートを表示したい
似たような記事が多くそれぞれの回答を試してみたのですが、うまくいかなかったため質問させていただきます。 ただいまテキストBOXとプルダウンメニューで成り立つ入力フォームを作成しています。 そこで、テキストはすべて入力した状態、プルダウンメニューを一番上以外のものを選択した状態でないと次の画面に遷移しないようにしたいのですが、プルダウンメニューの所だけうまくいきません。どうか回答よろしくお願いします。以下にソースをすべて載せておきます。 <html> <head> <title>test</title> <script language="JavaScript"><!-- function check(){ fName = ["id","name","grade","english","math","japanese","science","society"]; for (i=0; i<8; i++){ txt = document.forms[0].elements[fName[i]].value; if (txt == "") { alert("すべての項目を入力してください"); return false; } } var sel; sel = document.forms.school.value; if(sel=="00"){ alert("選択されていない項目があります");//アラート表示 return false; } return true; } // --></script> </head> <body> <form action="student_add1.php" name="forms" method="get" onSubmit="return check()"> 生徒番号：<select name="school"> <option value="00">==学校名==</option> <option value="01">桜中学校</option> <option value="02">紅葉中学校</option> <option value="03">青山中学校</option> <option value="04">高岡中学校</option> <option value="05">中野中学校</option> </select><input type="text" name="id" size="3"><br> 氏名：<input type="text" name="name" size="12"><br> 学年：<input type="text" name="grade" size="2"><br> 模試成績：<br><br>英語：<input type="text" name="english" size="3"> 数学：<input type="text" name="math" size="3"> 国語：<input type="text" name="japanese" size="3"> 理科：<input type="text" name="science" size="3"> 社会：<input type="text" name="society" size="3"><br> <input type="submit" value="送信"> <input type="reset" name="reset" value="リセット"> </form> </body> </html>
- ベストアンサー
- JavaScript
- テキストボックス未記入時のアラート表示 JS
【出来ていること】 下記のように電話番号の未入をチェックしアラートを出すことができました。 <script> function check3() { tel3check = document.form3.tel3.value; data13 = tel3check; if(!data13) { alert("電話番号が未入力です13"); return; } else { document.form3.submit(); } } </script> <form method="POST" action="in.php" name = "form3"> <input type="text" name="tel3" value="" /> <input type="button" value="確認" name="sub1" onclick="check3();"> </form> 【躓いていること】 電話番号の未入だけでなく、FAXの未入もチェックしそれぞれでアラートを出そうとしましたが動きません。ご指導いただけますでしょうか? よろしくお願いいたします。 <script> function check3() { tel3check = document.form3.tel3.value; fax3check = document.form3.fax3.value; data13 = tel3check; data133 = fax3check; if(!data13) { alert("電話番号が未入力です13"); return; } elseif(!data133) { alert("FAX番号が未入力です133"); return; } else { document.form3.submit(); } } </script> <form method="POST" action="in.php" name = "form3"> <input type="text" name="tel3" value="" /> <input type="text" name="fax3" value="" /> <input type="button" value="確認" name="sub1" onclick="check3();"> </form>
- ベストアンサー
- JavaScript
- ラジオボタン未チェックの場合のアラート
送信ボタンを押したときに、ラジオボタンが未チェックの場合に、アラートを出すように、 以下の内容でスクリプトを組んでいるのですが、チェックをしても アラートが出てしまいます。 あまりjavascript強くないので、自分では限界なので どなたか分かる方いらっしゃいましたらご指摘お願いします。 【HEAD内スクリプト】 function beforeSubmit(){ if(F1.NOUHIN[0].checked == false || F1.NOUHIN[1].checked == false || F1.NOUHIN[2].checked == false || F1.NOUHIN[3].checked == false || F1.NOUHIN[4].checked == false || F1.NOUHIN[5].checked == false){ alert("ご希望の納品時間を選んでください"); return false; } } 【BODY内ソース】 <form name=F1 action=mailto:****?subject=ORDER method=post encType=text/plain onSubmit="return beforeSubmit()" method="post" enctype="text/plain"> <input type="radio" name="NOUHIN" value="指定なし">指定なし <input type="radio" name="NOUHIN" value="午前">午前 <input type="radio" name="NOUHIN" value="14～16時">午後2～4時 <input type="radio" name="NOUHIN" value="16～18時">午後4～6時 <input type="radio" name="NOUHIN" value="18～20時">午後6～8時 <input type="radio" name="NOUHIN" value="20～21時">午後8～9時 </form>
- ベストアンサー
- JavaScript
- フォームのname値を配列にしてJavaScriptでフォームのチェックをする方法
JavaScriptでフォームの半角数字のチェックをしたいのですが、 form内容をCGI(PHP)に渡すためname値を配列にしないといけないのですが、 以下のスクリプトだとエラーが出てしまいます。 *実際はif(isNaN～)と<input～>をループで書き出しており、行数が不特定なので それぞれ別のname値を使うことができない状態です。 <script language="JavaScript"> function check() { if(isNaN(document.form1.hoge[0].value)){ alert("値は半角数字で入力してください。"); return(false); } if(isNaN(document.form1.hoge[1].value)){ alert("値は半角数字で入力してください。"); return(false); } return(true); } </script> <form method="post" action="xxx.cgi" onSubmit="return check()" name="form1"> <input type="text" name="hoge[0]"> <input type="text" name="hoge[1]"> </form> 特にCGIに渡す必要がなければ <input type="text" name="hoge"> <input type="text" name="hoge"> としてやればチェックができるのですが、どうしても次の 処理があるためname値を配列にする必要があります。 解決方法がわかる方がおられましたらご教授ください。 以上よろしくお願いいたします。
- ベストアンサー
- JavaScript
- ラジオボタンの選択で解答・点数を表示する
10問のテストを作成しています。 (1)選択肢はラジオボタンで3択（正解は10点、その他0点） (2)採点をクリックすると、テキストボックスに○×の結果を出し、もう一つ別のテキストボックスに×の場合は正しし解答を表示 (3)アラートで「あなたの点数は～～点」と出す (4)FORM1.2のSCOREに点数を表示 以上のようにしたいと思い、下記のように作りました。 まだ初心者のため、長々と同じことを書くことしか分からないので、もっと簡単にまとめられる方法がありましたら、教えてください。 よろしくお願いいたします。 function dispscore() { var score=0; if (document.form1.q0[0].checked) { score += 10; document.form1.r0.value = "○"; } else{ document.form1.r0.value = "×"; document.form1.a0.value = "ナイル川"; } if (document.form1.q1[2].checked) { score += 10; document.form1.r1.value = "○"; } else{ document.form1.r1.value = "×"; document.form1.a1.value = "バチカン市国"; } alert("点数は " + score + " 点 です "); document.form1.score.value=score document.form2.score.value=score } ------------------------------------------------------------ <INPUT type=radio name="q1" value="10">ナイル川 <INPUT type=radio name="q1" value="0">ミシシッピー川 <INPUT type=radio name="q1 value="0">アマゾン川> <INPUT size="3" name="r1" type="text"> <INPUT size="25" name="a1" type="text"> <INPUT type=radio name="q2" value="0">バルカン市国 <INPUT type=radio name="q2" value="0">バルタン市国 <INPUT type=radio name="q2" value="10">バチカン市国 <INPUT size="3" name="r2" type="text"> <INPUT size="25" name="a2" type="text">
- ベストアンサー
- JavaScript
- alertが表示されないのです。
SQLサーバーから検索して情報を取り出す設定でフォームを作りました。 性別のラジオボタンを選択せず、検索ボタンを押すとalertがでるようにしたいのですが出てきません。見ていただけませんか？（一部省略しています） <html> <head> <script language="JavaScript"> <!-- function afSubmit(){ if(optSex[0]=false and optSex[1]=false and optSex[2]=false); { alert("性別を選択してください。"); return false; } } //--> </script> </head> <body> <form name="frmEnq" action="kensaku2.asp" method="post" onSubmit="JavaScript:return afSubmit();"> <center><table border="5" width="400" > <tr bgcolor="#ffcc66"> <td colspan="2"></td> </tr> <tr> <td>■設問１■</td> <td> <select name="lstANQ1"> <option value=0>全件 </td> </tr> <tr> <td>■設問２■</td> <td> <select name="lstANQ2"> <option value=0>全件 </td> </tr> <tr> <td>■性 別■</td> <td> <input type="radio" name="optSex" value=0>全件 <input type="radio" name="optSex" value=1>男性 <input type="radio" name="optSex" value=2>女性 </td> </tr> <tr> <td>■年 齢■</td> <td> <select name="lstAge"> <option value=0>全件 </td> </tr> <tr> <td colspan="2"><center> <input type="submit" value="検索"> <input type="reset" value="キャンセル"> </center></td> </tr> </table></center> </body> </html>
- ベストアンサー
- JavaScript
- 2つのjavascriptを組み合わせたい
フォームメール用の2つのjavascriptがあります。 ●2重送信防止とデータ送信後指定ページへ遷移するjavascript ●テキストボックスが空欄だった時にアラートを表示するjavascript の2つです。 この2つを組み合わせようとしたのですが、うまく動きません。 ご指導いただきたくお願いいたします。 *************************************************** 【●2重送信防止とデータ送信後指定ページへ遷移するjavascript】【動きます】 送信ボタン押下後、2重送信を防止しながら、データ送信後は「location.href = "finish.html"」でfinish.htmlを表示します。 <script type="text/javascript" src="js/jquery.js"></script> <script> jQuery(function($) { $('#form1').submit(function(event) { // HTML送信キャンセル event.preventDefault(); //フォーム要素取得 var $form = $(this); // 送信ボタンを取得 // （後で使う: 二重送信防止） var $button = $form.find('button'); // 送信 $.ajax({ url: $form.attr('action'), type: $form.attr('method'), data: $form.serialize() + '&delay=1', timeout: 10000, // 送信前 beforeSend: function(xhr, settings) { // ボタン無効二重送信防止 $button.attr('disabled', true); }, // 応答後 complete: function(xhr, textStatus) { // ボタン有効再送信許可 $button.attr('disabled', false); }, // 通信成功処理 success: function(result, textStatus, xhr) { // 入力値初期化 $form[0].reset(); location.href = "finish.html"; }, // 通信失敗処理 error: function(xhr, textStatus, error) { alert('retry');} }); }); }); </script> <form name="form1" id="form1" method="POST" name="form1" action="insert.php"> <input type="text" name="tel" value="" /> <input type="text" name="fax" value="" /> <input type="submit" value="送信A"> </form> *************************************************** 【●テキストボックスが空欄だった時にアラートを表示するjavascript】【動きます】 テキストボックスが空欄だったらアラートを表示します。 <script> function check3() { var tel3 = document.form1.tel.value; var fax3 = document.form1.fax.value; var isValid = true; if (!tel3) { alert("電話未入力"); isValid = false; } if (!fax3) { alert("FAX未入力"); isValid = false; } if (!isValid) { return; } document.form1.submit(); } </script> <form name="form1" id="form1" method="POST" name="form1" action="insert.php"> <input type="text" name="tel" value="" /> <input type="text" name="fax" value="" /> <input type="submit" value="送信B" onclick="check3();"> </form> *************************************************** 【上記の2つを組み合わせてみました。】【動きません】 テキストボックスが空欄だったらアラートを表示しながら2重ボタン排除&finish.htmlに遷移というものです。 【結果】 「問題なく動くjavascript」2つを単純に組み合わせただけなのですが、 finish.htmlに遷移せずinsert.phpが表示されます。ご指導宜しくお願いします。 <script type="text/javascript" src="js/jquery.js"></script> <script> jQuery(function($) { $('#form1').submit(function(event) { event.preventDefault(); var $form = $(this); var $button = $form.find('button'); $.ajax({ url: $form.attr('action'), type: $form.attr('method'), data: $form.serialize() + '&delay=1', timeout: 10000, beforeSend: function(xhr, settings) { $button.attr('disabled', true); }, complete: function(xhr, textStatus) { $button.attr('disabled', false); }, success: function(result, textStatus, xhr) { $form[0].reset(); location.href = "finish.html"; }, error: function(xhr, textStatus, error) { alert('retry');} }); }); }); </script> <script> function check3() { var tel3 = document.form1.tel.value; var fax3 = document.form1.fax.value; var isValid = true; if (!tel3) { alert("電話未入力"); isValid = false; } if (!fax3) { alert("FAX未入力"); isValid = false; } if (!isValid) { return; } document.form1.submit(); } </script> <form name="form1" id="form1" method="POST" name="form1" action="insert.php"> <input type="text" name="tel" value="" /> <input type="text" name="fax" value="" /> <input type="submit" value="送信B" onclick="check3();"> </form>
- ベストアンサー
- JavaScript
- radioボタンでも、うまくアラート処理したいのですが・・・
<SCRIPT LANGUAGE="JavaScript"> <!-- // ヌル及び空欄のチェックを行う function isFilled(elm) { if (elm.value == "" || elm.value == null) return false; else return true; } function isReady(form) { // 名前の空欄のチェックを行う if (isFilled(form.name) == false) { alert("お名前を入力して下さい。"); form.name.focus(); return false; } return true; } //--> </SCRIPT> フォームによるアンケートページを作成しているのですが、 textボックスで回答が書かれていなく、空欄の部分があったら アラートを出し、そのtextボックス部分に戻す、というような 上記プログラムの流れにしています。 textボックスではうまくいくのですが、radioボタンのとき、 うまくいきません(アラートは出るが、フォームに戻らない)。 回避策を教えてください。
- ベストアンサー
- JavaScript
- JAVAスクリプトでのFORM入力チェックの方法
JAVAスクリプトでのFORM入力チェックの方法を教えてください。 ネットでいろいろ探してはめ込んだのですが、動作するプログラムが下記のしかありませんでした。 ラジオボタンの入力チェックとプルダウンの入力チェックを同時にしたいのですがよくわかりません。 今の状態ではラジオボタンをチェックしても未入力のアラートが出てしまいます。 あとこれにプルダウンの入力チェックをつけたいのですが… すいませんがどなたか教えてください。よろしくお願いします。 function Form_Validator(theForm) { var flag=false; var i; for(i=0; i<theForm.OPT-00-06.length; i++){ if (theForm.OPT-00-06[i].checked){ flag = true; break; } } if(!flag){ alert("\"OPT-00-06\" にチェックしてください。"); return (false); } if(confirm("入力もれはありません。")){ return (true); }else{ return (false); } <form name="form1" method="POST" action="～cgi?" onsubmit="return Form_Validator(this);"> ・ ・ <input type="radio" name="OPT-00-06" value="A"> <input type="radio" name="OPT-00-06" value="B"> ・ ・ <select name="OPT-00-07"> <option value="">選択してください</option> <option value="80">８０</option> <option value="81">８１</option> ・ ・ ・ <select name="OPT-00-08"> <option value="">選択してください</option> <option value="35">３５ｃｍ</option> <option value="36">３６ｃｍ</option> ・ ・ ・ <input type="submit" value="カートに入れる" name="submit"> <input type="reset" value="内容をクリア" name="reset"> </div> </form>
- ベストアンサー
- JavaScript
補足
ラジオボタンがそれぞれ独立してしまっているので、一度押すとキャンセルはできないようになっちゃうはずだけど？ 単独でオン・オフする場合は、チェックボックスを使うべきでは？ …というか、必ずチェックされなければならないものを、ユーザに全部チェックさせるのかなぁ？ ↑はい。すべてにチェックという感じです。 submitから csvへの投入になり、各セルに振り分けを作成しております。