フォームの必須事項について

このQ&Aのポイント
  • フォームにおいて、メールアドレスとお名前の入力を必須にする方法について教えてください。
  • 全ての項目を必須にするための記述方法についても教えてください。
  • JavaScriptを使用した方法についても解説しているサイトを紹介していただけますか?
回答を見る
  • ベストアンサー

フォームの必須事項について

よろしくお願いします。 以下のようなメールフォームを作成しました。 <form action="../../cgi-bin1/questionform.cgi" method="post"> <p>・名前<br /> <input type="text" name="お名前" size="40" /> </p> <p>・メールアドレス<br /> <input type="text" name="email" size="40" style="ime-mode:disabled" /> </p> <p>・郵便番号<br /> <input type="text" name="郵便番号" size="10" style="ime-mode:disabled" /> </p> <p> <input type="submit" value="登録" /> <input type="reset" value="リセット" /> </p> </form> 上記のメールアドレスとお名前の入力が無いと、送信出来ないように必須事項にしたいのですが、このような場合は、htmlに何らかの記述をすればよいのでしょうか? 全てを必須にするには以下の記述をすれば良いようですが、私が実行したい内容とは少し異なっていたためご質問をさせていただきました。 <input type="hidden" name="space_check" value="on"> そしてどうやら、java スクリプトを使うと良いようですが解説しているサイトを一度拝見したのですが全く分かりませんでした。 どなた様か、ご指導の程よろしくお願いします。

  • pcckit
  • お礼率76% (472/621)
  • Java
  • 回答数1
  • ありがとう数1

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

  • ベストアンサー
noname#94983
noname#94983
回答No.1

まず、ここは「Java」のカテゴリであって、「JavaScript」ではない。両者は全然違う言語なので、注意したほうが良いと思う。 ついでなので簡単に回答しておくと、項目チェックのための簡単な関数を定義しておき、submitのonclickでその関数を呼び出すようにしておけばいい。 <script type="text/javascript"> function check(){ var flg = true; // 以下のようにして必要な項目の値が空かどうかチェックする。 if (document.getElementById("name").value == "") flg = false; if (document.getElementById("email").value == "") flg = false; // チェックが終わったらflgがtrueかどうか調べる。 if (flg){ return true; } else { document.getElementById("message").innerHTML = "名前とメールアドレスは必須です。"; return false; } } </script> ・formタグは、こんな感じ。 <div id="message"></div> <form name="form1" id="form1" action="../../cgi-bin1/questionform.cgi" method="post"> <p>・名前<br /> <input type="text" name="お名前" id="name" size="40" /> </p> <p>・メールアドレス<br /> <input type="text" name="email" id="email" size="40" style="ime-mode:disabled" /> </p> <p>・郵便番号<br /> <input type="text" name="郵便番号" id="zip" size="10" style="ime-mode:disabled" /> </p> <p> <input type="submit" value="登録" onsubmit="check();"/> <input type="reset" value="リセット" /> </p> </form>

pcckit
質問者

お礼

logger_man様 大変恐縮です。すいませんでした。 JavaとはJavaScriptだとばっかり思っておりました。 今後は十分に注意いたします。 この度は、ご指導ありがとう御座いました。

関連するQ&A

  • メールフォームの必須事項設定について

    よろしくお願いします。 以下のようなメールフォームを作成しました。 <form action="../../cgi-bin1/questionform.cgi" method="post"> <p>・名前<br /> <input type="text" name="お名前" size="40" /> </p> <p>・メールアドレス<br /> <input type="text" name="email" size="40" style="ime-mode:disabled" /> </p> <p>・郵便番号<br /> <input type="text" name="郵便番号" size="10" style="ime-mode:disabled" /> </p> <p> <input type="submit" value="登録" /> <input type="reset" value="リセット" /> </p> </form> 上記のメールアドレスとお名前の入力が無いと、送信出来ないように必須事項にしたいのですが、このような場合は、htmlに何らかの記述をすればよいのでしょうか? 全てを必須にするには以下の記述をすれば良いようですが、私が実行したい内容とは少し異なっていたためご質問をさせていただきました。 <input type="hidden" name="space_check" value="on"> どなた様か、ご指導の程よろしくお願いします。

  • お問い合わせフォームの記述方法について

    よろしくお願いします。 以下のようにお問い合わせフォームを作成しました。 <form> <p>・名前<br /> <input type="text" name="お名前" size="40" /> </p> <p>・メールアドレス<br /> <input type="text" name="email" size="40" style="ime-mode:disabled" /> </p> <p>・郵便番号<br /> <input type="text" name="郵便番号" size="10" style="ime-mode:disabled" /> </p> <p>・住所<br /> <input type="text" name="住所" size="40" /> </p> </form> 上記の住所の欄に、都道府県を選択出来るようにしたいのですが この様な場合、どういった記述方法が必要なのでしょうか? 書籍を見てみたのですが、複数選択できる案内は記載されていなく 方法が分からずに困っております。 どなた様か、ご指導の程よろしくお願いします。

    • ベストアンサー
    • HTML
  • メールフォームについて

    よろしくお願いします。 メールフォームを設置して以下の記述をhtmlにしました。 サーバー上で確認をしたところ送受信は出来たのですが、受信したメールを確認してみると、メールアドレスは正常に表示されるのですが 名前の部分が以下のように表示されてしまいます。 繝。繝ォ繝槭ぎ縺雁錐蜑・ value= = どなた様かご指導の程よろしくお願いします。 <form action="../cgi-user/questionform.cgi" method="post"> <p>お名前 <br /><input type="text" name="メルマガお名前" size="40" value="" /> </p> <p>メールアドレス <br /><input type="text" name="email" size="40" value="" /> </p> <p> <input type="submit" value="登録" /> <input type="reset" value="リセット" /> </p> </form>

    • 締切済み
    • CGI
  • フォームのリンクについて

    nyuryoku.php <form method="POST" action="kakunin.php"> <p> </p> <p><a href="変更フォーム"><img border="0" src="henkou.gif"></a><a href="会社フォーム"><img border="0" src="kaisya.gif"></a></p> <p>変更フォーム</p> <p>名前<input type="text" name="T1" size="20"></p> <p>住所<input type="text" name="T2" size="20"></p> <p>TEL<input type="text" name="T3" size="20"></p>  <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <p>会社フォーム</p> <p>会社名<input type="text" name="T4" size="20"></p> <p>会社住所<input type="text" name="T5" size="20"></p> <p>会社TEL<input type="text" name="T6" size="20"></p> <p> </p> <p><input type="submit" value="送信" name="B1"><input type="reset" value="リセット" name="B2"></p> </form> <form>から</form>の中に変更フォームと会社フォームがあり henkou.gifをクリックすると画面上に変更フォームが現れて、kaisya.gifをクリックすると会社フォームが表れるようにしたいのです。 そして入力された情報は<input type="submit" value="送信" name="B1">で一度に送信できるようにしたいのですが、 henkou.gifとkaisya.gifにどういう風にリンクをはり各フォームだけを表示するにはどうしたらいいでしょうか?

    • ベストアンサー
    • PHP
  • java。html。jsp起動はどうすればいいの? 

    java。html。jsp起動はどうすればいいの?  下記の例のとき。 1)登録ボタン、照会ボタンが押されたら任意のjspを起動したいです。 2)jsp起動による処理以外にも もっと良い方法があれば教えてください。 受注N0 <input type=text name=order_no style="ime-mode: disabled;"><br> 受注日 <input type=text name=order_date style="ime-mode: disabled;"><br> 発注者名<input type="text" name="order_date" size="40" maxlength="20" style="ime-mode: active;"><br> 製品名 <input type=text name=order_date style="ime-mode: active;"><br> 受注量 <input type=text name=order_date style="ime-mode: disabled;"><br> </font> <input type=submit value="登録" name=btn1> <input type=reset value="クリア" name=btn2> <input type="button" value="終了" onClick="javascript:window.close();"> <input type=submit value="照会" name=btn4> 以上宜しくお願いします。

    • ベストアンサー
    • Java
  • このメールフォームが機能しないのは何故ですか?

    お世話になります。メールフォームを作成してCGIプログラムでメールを送信できるようにしたいと思い、以下のようにhtmlを作成しました。CGIはSYNCK GRAPHICAさんのサイトでお借りして自動返信機能付メールフォームCGIというCGIを使わせてもらいました。?http://www.synck.com/contents/download/cgi-perl/mailform.html レンタルしているサーバはロリポップです。?http://www.lolipop.jp/?mode=manual&state=hp&state2=cgi? CGIでロリポップが指定しているPERLパス・SENDMAILパスを変更してパーミッションも700に設定したのですが、何故かエラーの表示が出て、うまく作動してくれません。郵便番号自動検索機能も正常に機能しません。それでSYNCK GRAPHICAさんにどうして?と聞いたのですが、「http://www.自分のサイトアドレス/mailform.js←ここにファイルが無いためと考えられます。」という返事のみで、「何のファイルがないの?」って感じで全く分かりませんでした。初心者ゆえどこか基本的なことを見落としていると思います、どうか教えてください。 <table> <tr> <td>メールアドレス<span>*</span><p class="form">e-mail address</p></td> <td class="kakikomi"><input type="text" name="email(必須)" style="width: 300px;ime-mode: disabled;" onBlur="keepField(this.form.id)"></td> </tr> <tr> <td>確認用メールアドレス<span>*</span><p class="form">e-mail address</p></td> <td class="kakikomi"><input type="text" name="confirm_email" style="width: 300px;ime-mode: disabled;" onBlur="keepField(this.form.id)"></td> </tr> <tr> <td>お名前<span>*</span><p class="form">your name</p></td> <td class="kakikomi"><input type="text" name="お名前(必須)" style="width: 300px;ime-mode: active;" onBlur="keepField(this.form.id)"></td> </tr> <tr> <td>性別<p class="form">sex</p></td> <td class="kakikomi"><input type="radio" name="性別" value="男" onBlur="keepField(this.form.id)">男 <input type="radio" name="性別" value="女" onBlur="keepField(this.form.id)">女</td> </tr> <tr> <td>電話番号 <p class="form">telephone number</p> </td> <td class="kakikomi"><input type="text" name="電話番号" style="width: 120px;ime-mode: disabled;" onBlur="keepField(this.form.id)"></td> </tr> <tr> <td>郵便番号<p class="form">postcode</p></td> <td class="kakikomi"><input type="text" name="郵便番号" style="width: 60px;ime-mode: disabled;" onBlur="keepField(this.form.id)"> <input type="button" value="〒から住所を自動入力" name="postcode" onClick="javascript:checkPostcode('mailform','郵便番号','住所(必須)');"></td> </tr> <tr> <td>住所<span>*</span><p class="form">address</p></td> <td class="kakikomi"><input type="text" name="住所(必須)" style="width: 300px;ime-mode: active;" onBlur="keepField(this.form.id)"></td> </tr> <tr> <td>ご用件<span>*</span><p class="form">inquiry subject</p></td> <td class="kakikomi"><select name="ご用件(必須)" id="business" onBlur="keepField(this.form.id)"> <option value="" selected>下記の中から必ず選択して下さい</option> <option value="デザイン・印刷のお見積り">デザイン・印刷のお見積り</option> <option value="その他お問い合わせ">その他お問い合わせ</option> </select> </td> </tr> <tr> <td>ご用件<span>*</span><p class="form">inquiry body</p></td> <td class="kakikomi"><textarea name="ご用件(必須)" style="width: 300px;height: 140px;ime-mode: active;" onBlur="keepField(this.form.id)" rows="15" cols="30"></textarea></td> </tr> <tr> <td>送信確認<p class="form">sending confirm</p></td> <td class="kakikomi"><input type="checkbox" name="送信確認(必須)" value="送信チェック済み" onClick="keepField(this.form.id)">上記内容を確認したらチェックを入れてください</td> </tr> <tr> <td></td> <td class="kakikomi"><input type="submit" value="メールを送信する"> <input type="reset" name="reset" value="リセット"><br></td> </tr> <tr> <td></td> <td class="kakikomi"><span>*</span>は必須項目です。</td> </tr> </table> </form>

    • ベストアンサー
    • CGI
  • フォームについて

    マイホームページに 下記のようなフォームを作成しました。 <font color="#666666" size="2" face="MS Pゴシック, Osaka">このサイトについての感想、ご意見</font> <br> <br> <br> <form action="/cgi-bin/FormMail.cgi" method="POST"> <font color="#666666" size="2" face="MS Pゴシック, Osaka">お名前</font>:<input type="text" name="realname" size="30"> <br> <br> <font color="#0099FF" size="2" face="MS Pゴシック, Osaka">メールアドレス</font>: <input type="text" name="email" size="35"> <br> <br> ご意見・ご感想: <textarea name="textfield" cols="50" rows="5"></textarea>     <br> <br> <input type="hidden" name="recipient" value="yssm@cameo.plala.or.jp"> <input type="hidden" name="required" value="email,realname"> <input type="hidden" name="subject" size="50" value="TEST MAIL from WWW" /> <input name="submit" type="submit" value="送信" /> <input type="reset" value="初めから書き直す"> </form> これを私のメールアドレス(yssm@cameo.plala.or.jp)に送信したいのですがうまくいきません。 基本的な部分、思考が間違っているのでしょうか。 ご回答をよろしくお願いいたします。

  • アンケートフォームがうまく動かない

    プロバイダーは日本テレコム、レンタルサーバーはロリポップです。 以下のように、アンケートフォームを作りました。 <FORM ACTION="/cgi-bin/enquete.cgi?user=○○○○&address=○○○○@○○" METHOD="post"> 名前 <INPUT TYPE="text" NAME="name" SIZE="18" maxlength="30"><br><br> 居住地(都道府県のみ) <INPUT TYPE="text" NAME="house" SIZE="18" maxlength="30"><br><br> メールアドレス <INPUT TYPE="text" NAME="name" SIZE="18" maxlength="30"><br><br> 年齢 <input type="checkbox"name="old"value="19歳以下">19歳以下 <input type="checkbox"name="old"value="20~25歳未満">20~25歳未満 <input type="checkbox"name="old"value="25~30歳未満">25~30歳未満 <input type="checkbox"name="old"value="30~35歳未満">30~35歳未満 <input type="checkbox"name="old"value="35~40歳未満">35~40歳未満 <input type="checkbox"name="old"value="40~45歳未満">40~45歳未満 <input type="checkbox"name="old"value="45~50歳未満">45~50歳未満 <input type="checkbox"name="old"value="50歳以上">50歳以上<br><br> アンケートにご協力いただきましてありがとうございました。<br><br> <INPUT TYPE="SUBMIT" VALUE="送信する"> <INPUT TYPE="RESET" VALUE="書き直す"> </FORM> 以上のようなものです。 ですが、送信ボタンを押しても、ロリポップ側で、「指定されたページ(URL)は見つかりません。」と出ます。 上部の○○部分、2つありますが、後半のほうは送信先となるアドレスを記入しますよね。最初のほうの○○には何を記入するのですか? といいますか・・・上のHTMLは全然ダメですか? できるだけ平易に教えていただけましたらと思います。

  • cgiの記述方法について

    よろしくお願いします。 お問い合わせフォームを作成したくhtmlに以下の記述をしました。 やはり、これではフォームは機能しないようで、form action="../・・ にまだ何かを記述する必要があるようなのですが、書籍を見ても解決出来ずに困っております。 どなた様か、ご指導の程よろしくお願いします。 ご指導いただくにあたり、どこまでの説明が必要なのか分からなかったため、このようなご説明になってしまいましたが、よろしくお願い致します。 【html】 <form action="../cgi-user/questionform.cgi" method="post"> <p>お名前 <br /><input type="text" name="メルマガお名前" size="40" /> </p> <p>メールアドレス <br /><input type="text" name="email" size="40" /> </p> <p> <input type=submit value="登録" /> <input type="reset" value="リセット" /> </p> </form>

    • ベストアンサー
    • CGI
  • 半角の命令文について

    よろしくお願いします。 以下のようなフォームを作成しました。 お名前の部分は問題ないのですが、メールアドレスを入力頂く際に 入力欄をクリックすると自動的に半角になるように半角の命令文を記述したいのですが方法が分かりません。 記述方法のご指導をよろしくお願いします。 <form action="../cgi-user/questionform.cgi" method="post"> <p>お名前 <br /><input type="text" name="お名前" size="40" value="" /> </p> <p>メールアドレス <br /><input type="text" name="email" size="40" value="" /> </p> <p> <input type="submit" value="登録" /> <input type="reset" value="リセット" /> </p> </form>

    • ベストアンサー
    • HTML

専門家に質問してみよう