onclick時に、以下の三つの関数を、番号順で呼び出したいと考えています。
①未入力チェックを行う関数 checkName()
②文字数チェックを行う関数 checkByte()
③確認ダイアログを表示する関数 checkUpdate()
これら三つの関数を、一つの関数内にまとめて記述し、かつ上記の順で評価を行えるようにするには、どのように記述したらよいのでしょうか?
イメージを下記コードとともに記します。
<%--ボタン押下時に、callFunction()関数を呼ぶ。returnはいる? --%>
<input type ="submit" value="登録" name="regist_btn" onclick="return callFunction();">
<%--idの値をhiddenで保持。 --%>
<input type ="hidden" id="id" value"<%=id%>">
<%--callFunction関数内 --%>
funcrtion callFunction(){
<%--名前が未入力ならアラートをだし、falseを返す --%> return checkName(); ① <%--名前が入力されているが、文字数が制限を超えている場合にアラートをだし、false--%> return checkByte(); ② <%--idの値を取得 --%> var id = document.getElementByte('id') <%-- ①と②がtrueで、idがnullでなければ確認ダイアログを出す関数を呼ぶ --%> if(id != null){ updateChk(); ③ }
}
/*
- 商品名のテキストボックスが空白もしくはスペースの場合、
- アラート表示をするcheckForm関数です.
*/
function checkName(){
/*コードを見やすくするため、formプロパティを変数に取得します*/ var f = document.form; /*あらかじめ商品名のテキストボックスに含まれる空白文字を取り除いておきます*/ f.item.value = f.item.value.replace(/^\s+|\s+$/g, ""); /*空白文字を取り除いた上で、未入力チェックを行ないます AllBrankの場合も、未入力としてアラートを出します*/ //商品名が入力されていない場合、アラート表示します if(f.item.value == "") { window.alert('「商品名を入力して下さい」'); //商品名のテキストボックスにフォーカスを合わせます f.item.focus(); return false; } return true;
}
/*
- 文字列のバイト数を求めるgetByte関数です.
- @param text テキストボックスに入力された値
- @return count バイト数
*/
function getByte(text){
//バイト数を代入する変数 var count = 0; /*escape()メソッドにより、値の長さ分 文字列を1文字ずつ取り出しエンコードします。*/ for (i = 0; i < text.length; i++){ //エンコードされた文字をcharaに代入 var chara = escape(text.charAt(i)); /*もしcharaの長さが、4文字未満ならば1バイト、 4文字以上ならば2バイトとしてカウントします。*/ if (chara.length < 4){ count++; }else{ count += 2; } } return count;
}
/*
- バイト数をチェックし、最大値を超えて入力できないようにするcheckByte関数です.
*/
function checkByte(){
/*テキストボックスの値を引数にgetByte関数を呼び出し、バイト数を取得*/ var countByte = getByte(document.getElementById('item').value); /*もしバイト数が最大値以上になった場合、 アラート表示する処理です。*/ if(countByte >= 50){ window.alert('「商品名は全角25文字、半角50文字以内で入力して下さい」'); return false; } return true;
}
/*
*確認ダイアログ
*/
function updateChk(){
var flag = window.confirm('更新しますか?');
return flag;
}
個々の関数については動作の確認が取れています。
現在このような実装になっていますが、名前の未入力でアラートを出した後は、登録処理は中断されますが、文字数をこえた入力をした場合は、アラートが出ず、そのまま処理が走ってしまいます。おそらく、callFunction内の実装が正しくないからだと思いますが、調べても解決策が見つかりませんでした。どなたか正しい実装方法を教えてはいただけないでしょうか?よろしくお願いいたします。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2015/07/04 11:38