• ベストアンサー

別フレームへの必須入力チェック処理を行ないたい

ページ構成がフレーム仕様になっていて、ヘッダページ部分にある確認ボタンを押すことで、 メインページ(フレーム名:main)部分にある入力項目の複数項目に対する必須入力チェックを行ないたいのですが、うまく処理が実行されません。 if文の条件を、if (parent.main.document.forms[0].elements[0].value == "")のようにすると、 正しく処理されますが、入力項目の数だけ記述しなければならず、さらに入力項目の数は決まっていません。 どなたか解決策をご教授いただけませんでしょうか。 <SCRIPT language="javascript"> <!-- function formchk() { if (parent.main.document.f1.food.value == "") { alert("食べ物 の項目が未入力です"); parent.main.document.f1.food.focus(); return false; } if (parent.main.document.f1.drink.value == "") { alert("飲み物 の項目が未入力です"); parent.main.document.f1.drink.focus(); return false; } } // --> </SCRIPT>

質問者が選んだベストアンサー

  • ベストアンサー
回答No.3

No.2の方の言うとおりですね。 なので、以下のようにすれば出来ます。 チェック順は、food1,food2,food3,drink1,drink2,drink3 で行います。 <SCRIPT language="javascript"> <!-- function formchk() { with(parent.main.document.f1){ food_len = food.length; for(i = 0; i < food_len; i++){ if (food[i].value == "") { alert("食べ物 の項目が未入力です"); food[i].focus(); return false; } } drink_len = drink.length; for(j = 0; j < drink_len; j++){ if (drink[j].value == "") { alert("飲み物 の項目が未入力です"); drink[j].focus(); return false; } } } } // --> </SCRIPT>

ski_boader1977
質問者

お礼

kappa_nekoさん、回答ありがとうございました。 ご親切にサンプルコードまで記載していただき、本当に助かりました。 おかげさまで、仕様通りの処理ができるようになりました。 本当にありがとうございます!!

その他の回答 (2)

  • BLUEPIXY
  • ベストアンサー率50% (3003/5914)
回答No.2

>一番最後の入力項目だけに処理が行なわれています。 >同じname属性のフィールドがあることが原因なのでしょうか。 同じname属性が複数ある時は、配列で処理しないといけません。 配列の大きさはlengthでわかります 例えば、 f1.elements["food"].length でfoodの項目数がわかります。

ski_boader1977
質問者

お礼

BLUEPIXYさん、回答ありがとうございました。 基本的なプログラム知識がなかったので、配列の使い方などについて調べて、 うまく処理ができるようになりました。 本当にありがとうございます!!

回答No.1

with()で解決しませんか? <SCRIPT language="javascript"> <!-- function formchk() { with(parent.main.document.f1){ if (food.value == "") { alert("食べ物 の項目が未入力です"); food.focus(); return false; } if (drink.value == "") { alert("飲み物 の項目が未入力です"); drink.focus(); return false; } } } // --> </SCRIPT>

ski_boader1977
質問者

補足

kappa_nekoさん、回答ありがとうございます。 with()を入れて試してみましたが、一番最後の入力項目だけに処理が行なわれています。 チェック対象となるメインページ部のHTMLは以下のとおりです。 同じname属性のフィールドがあることが原因なのでしょうか。 <HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY> <FORM name="f1"><BR> <TABLE border="1"> <TBODY> <TR> <TD> </TD> <TD>食べ物</TD> <TD>飲み物</TD> </TR> <TR> <TD>1</TD> <TD><INPUT size="20" type="text" name="food"></TD> <TD><INPUT size="20" type="text" name="drink"></TD> </TR> <TR> <TD>2</TD> <TD><INPUT size="20" type="text" name="food"></TD> <TD><INPUT size="20" type="text" name="drink"></TD> </TR> <TR> <TD>3</TD> <TD><INPUT size="20" type="text" name="food"></TD> <TD><INPUT size="20" type="text" name="drink"></TD> </TR> </TBODY> </TABLE> <BR> </FORM> </BODY> </HTML>

関連するQ&A

  • メールアドレスの入力チェックをして、正しくなければ戻る方法

    今、フォームを作っているところなのですが、 各必須事項は入力されていないと戻るように設定していますが、同じ形でメールアドレスもチェックしたいのですが、その際にxxx@***.xxxという正規の形でないと引っ掛かるようにしたいのですが、どうすればよいでしょうか?お分かりの方、是非教えてください。 よろしくお願いします。 -------------------------------------------- 現在のスクリプトは以下のような感じです。 これでは、大文字などでメールアドレスを入れられてもチェックを通してしまいますので。。 function check(){ if(document.FF.お名前_漢字.value == ""){ alert("お名前_漢字を入力してください"); document.FF.お名前_漢字.focus(); return(false); } if(document.FF.住所.value == ""){ alert("住所を入力してください"); document.FF.住所.focus(); return(false); } if(document.FF.email.value == ""){ alert("メールアドレスを入力してください"); document.FF.email.focus(); return(false); } return(true); } -------------------------------------------- そして送信ボタンを押すと、このスクリプトが働くように、 onSubmit="return check()" を設定しています。

  • フォームの入力チェックをすると既に入力した項目が消える

    実は過去のQ&Aの中でご紹介されていた ホームページを拝見させて頂いたのですが、 残念ながら私の応用力が足りず、 上手く作ることが出来ません。 下記のように書いてみたのですが、 これでは未入力のメッセージにOKを押すと その前に入力したものが全て消えてしまいます。 何方か、正しい書き方をご教示下さいますよう 宜しくお願い申し上げます。 <script language="JavaScript"> <!-- function checkForm(){ if(document.form1.chk1.checked == false && document.form1.chk2.checked == false) { alert('チェックなし'); return false; } { flag = 0; for ( i = 0 ; i < document.form1.radiobtn.length ; i++){ if (document.form1.radiobtn[i].checked){ flag = 1; } } if (!flag){ alert('ラジオなし'); return false; } if(document.form1.sel.selectedIndex == 0){ alert('メニューなし'); document.form1.sel.focus(); return false; } if(document.form1.bun.value == ""){ alert('文字なし'); document.form1.bun.focus(); return false; } } return true; } //--> </script>

  • 一括で入力のチェックをしたいのです!

    どなたか教えてください・・・ フツー入力チェックを行う場合 <SCRIPT language="JavaScript"> <!-- function Check(){ if(document.myform.Name.value==""){ alert("名前を入力してください。"); return false; } if(document.myform.Email.value==""){ alert("Eメールアドレスを入力してください。"); return false; } if(document.myform.Email.value.indexOf("@")<=0){ alert("Eメールアドレスが正しくありません。"); return false; } if(document.myform.Comment.value==""){ alert("コメントを入力してください。"); return false; } return true; } // --> </SCRIPT> こんなカンジで各フォーム毎にチェックを行い メッセージを出したりすると思うのですが、 フォーム数が多いため、入力のチェックを 一括で行いたいのですが・・・ JavaScriptを始めて間もないため とんちんかんな質問をしている様でしたら すみません。 どなたか入力チェックを一括で出来る方法を 教えて頂けないでしょうか・・・ お願いします。

  • フォームのチェックについて

    今、フォームの送信ボタンを押すとチェックする 関数を作成しております。 function restChar() { if(10000 < document.F1.ご質問内容.value.length) window.alert("ご質問内容は全角5,000字以内でお願いします"); } function check(){ var flag = 0; if(document.F1.name.value == ""){ // 「お名前」の入力をチェック flag = 1; } else if(document.F1.kana.value == ""){ // 「パスワード」の入力をチェック flag = 2; } else if(document.F1.mail.value == ""){ // 「コメント」の入力をチェック flag = 3; }      else if(document.F1.ご質問内容.value == ""){ // 「コメント」の入力をチェック flag = 4; } if(flag == 1){ window.alert('お名前を入力してください'); // 入力漏れがあれば警告ダイアログを表示 return false; // 送信を中止 } if(flag == 2){ window.alert('フリガナを入力してください'); // 入力漏れがあれば警告ダイアログを表示 return false; // 送信を中止 } if(flag == 3){ window.alert('メールアドレスを入力してください'); // 入力漏れがあれば警告ダイアログを表示 return false; // 送信を中止 }      if(flag == 4){ window.alert('ご質問内容を入力して下さい'); // 入力漏れがあれば警告ダイアログを表示 return false; // 送信を中止 } fOBJ = document.F1.mail.value; check = /.+@.+\..+/; if (!fOBJ.match(check)){ window.alert("メールアドレスが正しくありません"); return false; // 送信を中止 } fOBJ = document.F1.ご質問内容.value.length; if(10000 < fOBJ){ window.alert("ご質問内容は全角5,000字以内でお願いします"); return false; // 送信を中止 } return true; // 送信を実行 } こんな感じです。 1-4のチェックは問題ないのですが、 アドレスと文字数のチェックは、一度は ダイアログがでますが、連続で押すと通ってしまいます。 何がわるいのでしょうか?

    • ベストアンサー
    • Java
  • JavaScriptでの必須項目設定

    現在、下記ジャバスクリプトにてアンケートフォームの必須項目確認をしていますが、SAFARIでは問題なく動くのですが、IE7では名前の打ち込みの必須確認(※1)は作動しますが、セレクトの場合(※2)セレクトしているにも関わらず「確認して下さい」という表示が出ます。どこか間違いがあるのでしょうか?よろしくお願いいたします。 (※1)IE7でも作動します。 function FormCheck() { var f0 = document.forms[0]; if (f0.代表者様お名前.value == "") { alert("代表者様お名前を入力してください。"); f0.代表者様お名前.focus(); return false; } (※2)IE7では「確認して下さい」と出ます。 listn = f0.ご来店月.selectedIndex; if (f0.ご来店月.options[listn].value == "") { alert("ご来店月を選択してください。"); f0.ご来店月.focus(); return false; }

  • 入力チェックをしたいです。

    結構初心者です。 フォームに入力された内容をチェックしたいので、まず下記のように書きました。 <script Language="JavaScript"> <!-- function submitCheck(){ var flag = 0; // 設定開始(必須にする項目を設定します) if(document.insert.MatterID.value == ""){ flag = 1; } else if(document.insert.name.value == ""){ flag = 1; } else if(document.insert.Correspondencedate.value == ""){ flag = 1; } if(flag){ window.alert('必須項目に未入力があります。'); // チェックされていない場合は警告ダイアログを表示 return false; // 送信を中止 } else{ return true; // 送信を実行 } } --> </script> で、これにチェックボックスの入力チェックも含めたいのですが、ただ else if(document.insert.bld_ReceiptNo.checked){ flag = 1; } こうするだけではダメなのですね;; どうすればいいかお知恵を拝借できませんでしょうか。

  • 別フレームのフォームへの入力で

    フレーム1(f1)のボタンを押すとフレーム2(f2)のテキストボックス(t1)に文章を入力するようにしたいのですが、 フレーム2のフォームに名前がついている時は(フォーム名はform1)、 parent.f2.form1.t1.value = "test"; で動作したのですが、フォームに名前がない場合に、 parent.f2.forms[0].t1.value = "test"; とした場合、「'parent.f2.forms.0'はNULLまたはオブジェクトではありません」とエラーが出てしまいます。 これを解消したいのですが、エラーの原因がわかりません。 教えてください。 よろしくお願いしますm(_ _)m

  • プルダウンメニューを選択していない時に送信ボタンを押した場合、(必須の)アラートを表示したい。

    過去にほぼ同じ質問がありましたが、それでも解決出来なかったので質問させていただきました。 フォームで未入力の項目に対してアラートとフォーカスされるようにしました。 そこにプルダウンメニューを加えたものを作ろうとしたのですが、アラートの内容が全部同じ(職業が選択されていません)になってしまった事と、アラートは表示されたのですが、プルダウンメニューを選択してもアラートが出続けてしまいます。 プルダウンメニューが未選択の場合にのみアラートを表示するにはどうしたらよいでしょうか。 <SCRIPT language="JavaScript"> <!-- function chkHissu(frm){ var hissu=Array('name','kana','age','mail','sex','syumi'); var hissu_nm = Array('名前','フリガナ','年齢','メールアドレス','性別','趣味'); var len=hissu.length; for(i=0; i<len; i++){ var obj=frm.elements[hissu[i]]; if(obj.type=='text' || obj.type=='textarea'){ if(obj.value==''){ alert(hissu_nm[i]+'は必須入力項目です'); frm.elements[hissu[i]].focus(); return false; } }else{ for(var j=0, chk=0; j<obj.length; j++){ if(obj[j].checked) chk++; } if(chk==0){ alert(hissu_nm[i]+'は必須入力項目です'); return false; } } } return true; } function check(value){ //数字かどうかのチェック if(isNaN(value)){ alert("数値を半角で入力してください。"); //警告コメント document.form1.age.focus(); return false; } //入力があるかどうかのチェック if(!value){ alert("年齢を入力してください。"); //警告コメント document.form1.age.focus(); return false; } } function checkAd(address){ if(!address){ alert("メールアドレスを入力してください。"); } else if(address.indexOf("@",0)<=0){ alert("メールアドレスが正しくありません。"); document.form1.mail.select(); return false; } } //-- </SCRIPT> ご存知の方がいらっしゃいましたらご教授願います。

  • 空白チェック

    下記はテキストボックスのいずれかに空白があればalertで知らせるものですが、特定のテキストボックスになんらかの印をつけておいて、それのみチェックできないでしょうか。nama="" の名称以外の取得の方法で。 function EmptyCheck(){ i=0; while(i<20){ if(!document.main.elements[i].value){ alert("入力されていない項目があります。"); return false; } i++; } }

  • JavaScriptの記述を添削してください。

    アンケートフォームを作成して送信ボタンを押してから 送信確認メッセージを出るようにいたしました。 今までは送信確認メッセージは出さずに 必須項目の未入力部分のみの確認で行っていましたが 送信ボタンを押した後に送信確認メッセージを出してから OKなら送信、キャンセルなら元に戻るというようにしてみました。 自分で動作確認したところでは問題ないようですが、 JavaScriptは超初心者の為まったく自信がありません。 お手すきの方がいましたら 間違っている箇所などをご指摘くださいますでしょうか。 //入力確認 // function kakunin() { if (document.F2.名前.value == "") { alert("名前が入力されていません。"); document.F2.名前.focus(); return(false); } if (document.F2.ふりがな.value == "") { alert("ふりがなが入力されていません。"); document.F2.ふりがな.focus(); return(false); }  if (document.F2.メール.value == "") { alert("メールアドレスが入力されていません。"); document.F2.メール.focus(); return(false); } // //↓以下を付け足しました。 //送信確認 // myRet = confirm("送信します。よろしいですか?"); if ( myRet == false ) return(false); return(true); } <FORM name="F2" method="POST" action="***/mail.cgi" onsubmit="return kakunin()"><INPUT type="hidden" name="_to_" value="***@***.ne.jp"><INPUT type="hidden" name="_subject_" value="***"><INPUT type="hidden" name="_location_" value="***.htm"><BR> <INPUT type="submit" value="送信ボタン"> 上部、入力確認は今まで問題無く動作していました。 よろしくお願いします。

専門家に質問してみよう