javaScriptを使用して、
textareaにエラーメッセージを追加する方法について考えているものです。
各項目の入力チェック後、
エラーが発生した項目のエラー内容を、
textareaに表示（エラーメッセージの追加）を行う場合、
現状の追加方法のままでも特に問題ないでしょうか？
考えとしては、
textarea のオブジェクトを、各項目の入力チェック関数の引数として渡して、
各入力チェックより、エラーメッセージが発生した場合、メッセージを追加してあげる、といった内容で考えています。
（※ソースをコメントに添付しております。）
私自身、javaScriptは余り触った事がない状態でして、現状としては“ひとまず動作する”といった形なのです。
記述として可笑しな点などがありましたらアドバイスいただけませんでしょうか？
※ 有料アンケート・ポイント付き質問機能は2023年2月28日に終了しました。
ログインして回答する
みんなの回答
-
pahoo
満足26pt
よくできているスクリプトだと思います。
ThinkThink さんは、他の関数型言語に素養のある方とお見受けいたしました。
そこで、ご質問の主旨から外れるかもしれませんが、ユーザー・フレンドリーという観点から、エラーメッセージを textarea ではなく、入力フィールドの近くに表示させてはいかがでしょう。
たとえば、確認用パスワードが一致していなかったら、以下のようにスクリプトの一部を変更することで、入力フィールドの隣にエラーメッセージを表示させることができます。⇒（参考）innerHTML
●文字列一致チェック（メイン関数の一部） strCheck(strPassword, strPasswordCheck, document.getElementById("pasPasswordCheck_errMsg"), "※確認用パスワードが一致しません"); ●文字列一致チェック関数 function strCheck(str1, str2, errMsg_obj, errMsg) { if (str1 != str2) { // alert("add errMsg"); errMsg_obj.innerHTML = errMsg; } } ●HTML部分 <td><input type="password" id ="pasPasswordCheck" name="pass2" value=""> <div id="pasPasswordCheck_errMsg"></div> </td> - その他の回答を読む
この質問へのコメント
質問の情報
- 登録日時
- 2009-06-03 02:34:28
- 終了日時
- 2009-06-10 02:35:04
- 回答条件
- 回答にURL必須 1人2回まで
この質問のカテゴリ
この質問に含まれるキーワード
人気の質問
-
この英文どうなってますか？ The boy seemed to be waiting for his mother to come.（その少年は母親が来…
匿名質問者
1
1
-
不定詞の形容詞的用法らしいんですけど、副詞的用法と書いたら✖️ですか？ I want to buy a book to read …匿名質問者11
-
日向陽葵という○V女優が好きなのですが似ている○V女優はいますか匿名質問者
-
共通テストで使われるプログラミング言語は共通テスト特有の言語と聞いたのですが、受験勉強で身につけたプ…匿名質問者1
-
内定してほしいポケモンはいますか？匿名質問者
<html>
<head>
<title>Noname</title>
<script type="text/javascript" src="errCheck.js"></script>
</head>
<body>
<center>
エラーメッセージ
<form name="form1">
<table class="table">
<tr>
<td colspan="2" align="center"><textarea id ="idErrMsg" name="errMsg" rows="5" cols="30" value=""></textarea><br><br><br><br><br></td>
</tr>
<tr>
<td><label id="idName">＊名前<label></td>
<td><input type="textBox" id="txtName" name="Name" value=""><br><br></td>
</tr>
<tr>
<td><label id="idPassword">＊パスワード</label></td>
<td><input type="password" id ="pasPassword" name="pass1" value=""><br><br></td>
</tr>
<tr>
<td><label id="idPasswordCheck">＊パスワード確認用</label></td>
<td><input type="password" id ="pasPasswordCheck" name="pass2" value=""><br><br></td>
</tr>
</table>
</form>
<input type="button" onclick="errCheck()" value="送信">
</center>
</body>
</html>
【errCheck.js】
//●入力チェック
function errCheck(){
//エラーメッセージ（textarea)オブジェクト確保
var errMsg_obj = document.getElementById("idErrMsg");
//エラーメッセージクリア
errMsg_obj.value = '';
//氏名チェック
nameCheck(errMsg_obj);
//パスワードチェック
passwordCheck(errMsg_obj);
}
//●氏名チェック
function nameCheck(errMsg_obj){
//エラー表示内容
var errMsg_01 = "No Data\n"
var strName = document.getElementById("txtName").value;
//未入力チェック呼び出し
noInputCheck(strName, errMsg_obj, errMsg_01);
}
//●パスワードチェック
function passwordCheck(errMsg_obj){
//エラー表示内容
var errMsg_01 = "No Data\n"
var errMsg_02 = "password check again\n"
var strPassword = document.getElementById("pasPassword").value;
var strPasswordCheck = document.getElementById("pasPasswordCheck").value;
//未入力チェック呼び出し
noInputCheck(strPassword, errMsg_obj, errMsg_01);
noInputCheck(strPasswordCheck, errMsg_obj, errMsg_01);
//文字列一致チェック
strCheck(strPassword, strPasswordCheck, errMsg_obj, errMsg_02);
}
//●未入力チェック
function noInputCheck(str, errMsg_obj, errMsg_01){
if(str == "" ){
alert("add errMsg");
errMsg_obj.value += errMsg_01;
}
}
//●文字列一致チェック
function strCheck(str1, str2, errMsg_obj, errMsg_02){
if(str1 != str2){
alert("add errMsg");
errMsg_obj.value += errMsg_02;
}
}
お返事方ができずに申し訳ありませんでした。
なんだか最近バタバタとしておりまして（汗）
ご照会いただきました方法について、
また試していってみたいと思っています、どうもありがとうございます。