お世話になります。
ユーザー名とパスワードを入力して送信するシンプルなログイン画面を作成しているのですが、ユーザー名かパスワードが未入力の状態で送信(ログイン)ボタンを押した場合はエラーとし、情報を送信しないように出来ますでしょうか。
ログインボタンを押下した際にポップアップ・ウインドウが表示されて「ユーザ名が未入力です」などと画面表示できるのが理想なのですが。。。
現在は下記のようなソースを書いております。
<input type="text" name="username">
<input type="password" name="password">
<input type="submit" value="ログイン">
どなたがご存知の方、お教えいただければ幸いです。
No.1ベストアンサー
- 回答日時:
こんにちは。
<form action="xxx" method="post" name="loginForm" onSubmit="return check();">
<input type="text" name="username">
<input type="password" name="password">
<input type="submit" value="ログイン">
</form>
<head>と</head>の間に
<script type="text/javascript">
<!--
function check () {
var userName = document.loginForm.username.value;
var passWord = document.loginForm.password,value;
if ( userName == "" ) {
alert ( "ユーザ名を入力して下さい。" );
document.loginForm.username.focus();
return false;
}
if ( passWord == "" ) {
alert ( "パスワードを入力して下さい。" );
document.loginForm.password.focus();
return false;
}
return true;
}
//-->
</script>
こうすることにより、送信時にcheckが呼ばれ、問題が無ければ送信され、
問題があった場合はアラートにて表示を行い、
自動的に問題のあるフォームへフォーカスが移ります。
試してみてください。
早速の回答ありがとうございます!
ご提示いただいたスクリプトを試してみましたところ、バッチリ希望通りの動きをしました。
やはりガリガリ書かないと実現できないのですね。。。
回答を頂きまして本当にありがとうございました。また何かありましたらよろしくお願い致します。
No.2
- 回答日時:
JavaScriptを使用するとこんな感じ
<html>
<head>
<script language="JavaScript">
<!--
function check() {
if(form1.username.value.length == 0){
window.alert("ユーザ名が未入力です");
}else if(form1.password.value.length == 0){
window.alert("パスワードが未入力です");
}else{
form1.submit();
}
}
// -->
</script>
</head>
<body>
<form name="form1">
<input type="text" name="username">
<input type="password" name="password">
<br>
<input type="button" onClick="check(); return false;" value="ログイン">
</form>
</body>
</html>
早速の回答ありがとうございました。
試してみたところ希望通りの動きをしました。やはりJavaScriptは色々な面で活躍するのですね。私もいつかvivletさんのようにJavaScriptを扱えるように日々精進してゆきたいと思います。
このたびは本当にありがとうございました。
また何かありましたらよろしくお願い致します。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
このQ&Aを見た人はこんなQ&Aも見ています
-
初めて自分の家と他人の家が違う、と意識した時
子供の頃、友達の家に行くと「なんか自分の家と匂いが違うな?」って思いませんでしたか?
-
フォロワー20万人のアカウントであなたのあるあるを披露してみませんか?
あなたが普段思っている「これまだ誰も言ってなかったけど共感されるだろうな」というあるあるを教えてください
-
映画のエンドロール観る派?観ない派?
映画が終わった後、すぐに席を立って帰る方もちらほら見かけます。皆さんはエンドロールの最後まで観ていきますか?
-
海外旅行から帰ってきたら、まず何を食べる?
帰国して1番食べたくなるもの、食べたくなるだろうなと思うもの、皆さんはありますか?
-
天使と悪魔選手権
悪魔がこんなささやきをしていたら、天使のあなたはなんと言って止めますか?
-
フォーム上で押されたボタンによってサーブレットの処理を変えたい
Java
-
Java-jspの画面入力値保持について
Java
-
jspからServletを呼び、元のjspページに戻るにはどうしたらよいですか?
Java
-
-
4
リクエストに応じたselectedの初期値設定方法
Java
-
5
データ未入力時のエラー処理がうまくできません・・・
Java
-
6
JSPでリンクを利用してパラメータを次画面に渡す方法について。
Java
-
7
JSPのクラスをコンパイルできない問題
Java
-
8
入力チェックとエラーメッセージの表示
Java
-
9
JSPでメッセージボックスを表示したい
Java
-
10
エラーページ遷移後に入力値を残す
Java
-
11
レコード件数の表示
Java
-
12
JSPのNULLレコード表示について教えて下さい。
Java
-
13
JSP/サーブレットで一般的な入力チェックの仕組みについて
Java
-
14
Java、2の0乗~10乗の表示
Java
-
15
java キーボード入力された値の数だけ文字を出力するfor文を使ったプログラムの書き方を教えてくだ
Java
-
16
jasper.exceptionとは?
Java
-
17
JSPやサーブレットでSystem.out.println()などでコンソールに出力できますでしょうか?
Java
-
18
JSPで<SELECT>の中にDBから持ってきたデータを反映させたい
Java
-
19
ResultSetインターフェイスでの next() の使い方
Java
-
20
正しいURL指定しているにもかかわらずJSPファイルにアクセスできず「404エラー」が発生
Java
関連するカテゴリからQ&Aを探す
おすすめ情報
- ・漫画をレンタルでお得に読める!
- ・人生のプチ美学を教えてください!!
- ・10秒目をつむったら…
- ・あなたの習慣について教えてください!!
- ・牛、豚、鶏、どれか一つ食べられなくなるとしたら?
- ・【大喜利】【投稿~9/18】 おとぎ話『桃太郎』の知られざるエピソード
- ・街中で見かけて「グッときた人」の思い出
- ・「一気に最後まで読んだ」本、教えて下さい!
- ・幼稚園時代「何組」でしたか?
- ・激凹みから立ち直る方法
- ・1つだけ過去を変えられるとしたら?
- ・【あるあるbot連動企画】あるあるbotに投稿したけど採用されなかったあるある募集
- ・【あるあるbot連動企画】フォロワー20万人のアカウントであなたのあるあるを披露してみませんか?
- ・映画のエンドロール観る派?観ない派?
- ・海外旅行から帰ってきたら、まず何を食べる?
- ・誕生日にもらった意外なもの
- ・天使と悪魔選手権
- ・ちょっと先の未来クイズ第2問
- ・【大喜利】【投稿~9/7】 ロボットの住む世界で流行ってる罰ゲームとは?
- ・推しミネラルウォーターはありますか?
- ・都道府県穴埋めゲーム
- ・この人頭いいなと思ったエピソード
- ・準・究極の選択
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
iPhoneで HTMLファイルを閲覧
-
htmlの文字が縦書きになる
-
CSSを教えて下さい webデザイナ...
-
テーブルの行を折りたたみたい...
-
css初心者 フレックスボックス...
-
2カラム、左メニュー、特定パー...
-
静止画画像をクリックすると音...
-
htmlで、文字に線を囲むには何...
-
HTMLです。画像をHTMLで表した...
-
HTMLでこの画像を表示したいで...
-
<!DOCTYPE html>あってますか?...
-
ボタンが押されたらWebページの...
-
HTMLで特定の文字だけ色を変え...
-
HTMLについて教えてください。 ...
-
テーブルのセルデータを自動改...
-
CSSでinputのテキストカラーを...
-
スマホでHTMLファイルを開いて...
-
CSSを教えて下さい webデザイナ...
-
このサイトのカテゴリのチェッ...
-
HTML CSSの勉強のポートフォリ...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
submitをボタン以外にするには
-
1アクションでPOST・GET、両方...
-
フォーム要素以外にもname属性...
-
複数のフォームを一括で送信す...
-
type="hidden"を使って時刻を送信
-
URL パラメータを使ってフォー...
-
リンクをクリックした時にform...
-
<a href=**?***=***>をGET方式で
-
送信ボタン押下時に値が未入力...
-
長文のmailtoの使い方
-
formなしでPOSTデータを送信・受信
-
送信フォームを2つ用意する方法
-
フォームの送信ボタンの位置
-
同じnameのhiddenで別々の内容...
-
フォームに入力した値をURLに付...
-
mailtoについて
-
HTMLからメーラーを起動し...
-
CGIを使わず、HTMLだけで作るメ...
-
チェックボックスにチェックを...
-
【html】)パスワード認証フォー...
おすすめ情報