checkbox必須チェック

質問

function hissuCheck(form) {
var paramArray = Array("…24個");
var alrtArray = Array("…24個");
var len = paramArray.length;
for(i=0; i<len; i++) {
var obj = form.elements[paramArray[i]];
if(obj.type == "text") {
if(obj.value == "") {
alert(alrtArray[i]+"は必須入力です");
form.elements[paramArray[i]].focus();
return false;
}
} else if(obj.type == "select-one" || obj.type == "select-multi") {
for(varSelected=0, j=0; j<obj.options.length; j++) {
if(obj.options[j].selected)varSelected+=obj.options[j].value;
}
if(varSelected == 0) {
alert(alrtArray[i]+"は必須入力です");
form.elements[paramArray[i]].focus();
return false;
}
} else {
for(varChecked=0, k=0; k<obj.length; k++) {
if(obj[k].type == "checkbox") {
if(obj[k].checked)varChecked++;
}
}
if(varChecked == 0) {
alert(alrtArray[i]+"は必須入力です");
return false;
}
}
}
return true;
}
必須チェックですが、最後のチェックボックスだけがチェックしても「…は必須です」とアラートが表示されてしまいます。どうか宜しくお願いします

回答No.5

dennou2000 · ベストアンサー

ANo.2です。

ANo.2で書いた事もありますが、決定的な誤りがあります。
ANo.3の回答へのお礼で、以下のように仰っています。

＞又、elseの後にalert(obj.length)と入れると[undefined]と表示されました。for文の条件分内の
＞obj.lengthはだめなのでしょうか？checkboxの数を数えるために何かいいプロパティがあれば
＞いいのですが…obj.valueは適切な名前が表示されましたが、for分内の条件文がスルーされてるので
＞obj[k].value等は確認できませんでした。

下記は、ソースのループ部分全体を抜き出したものです。

　　for(i=0; i<len; i++) {　　　　　　　　　　　　　　　　　// element単位でループ
　　　　var obj = form.elements[paramArray[i]];
　　　　if(obj.type == "text") {
　　　　　　if(obj.value == "") {
　　　　　　　　alert(alrtArray[i]+"は必須入力です");
　　　　　　　　form.elements[paramArray[i]].focus();
　　　　　　　　return false;
　　　　　　}
　　　　} else if(obj.type == "select-one" || obj.type == "select-multi") {
　　　　　　for(varSelected=0, j=0; j<obj.options.length; j++) {
　　　　　　　　if(obj.options[j].selected)varSelected+=obj.options[j].value;
　　　　　　}
　　　　　　if(varSelected == 0) {
　　　　　　　　alert(alrtArray[i]+"は必須入力です");
　　　　　　　　form.elements[paramArray[i]].focus();
　　　　　　　　return false;
　　　　　　}
　　　　} else {
　　　　　　for(varChecked=0, k=0; k<obj.length; k++) {　　// ※
　　　　　　　　if(obj[k].type == "checkbox") {
　　　　　　　　　　if(obj[k].checked)varChecked++;
　　　　　　　　}
　　　　　　}
　　　　　　if(varChecked == 0) {
　　　　　　　　alert(alrtArray[i]+"は必須入力です");
　　　　　　　　return false;
　　　　　　}
　　　　}
　　}

※の箇所で、element単位－－つまり一個毎のcheckboxをチェックしているループの中で、更に
それのlengthを取得しようとしています。
つまり、単数のものに複数のつもりで、個数を問うのでundefinedになるのです。
当然　for(varChecked=0, k=0; k<obj.length; k++)　は回らず、常にvarChecked=0だけが設定
されるので、alert文がでます。

修正するとしたら、

// 入力項目チェック
function checkItem(form) {
　　var paramArray =
　　　　[ "input01", "input02", "input03", "chkbox01", "chkbox02", "chkbox03", "select01", "select02", "select03" ];
　　var alrtArray =
　　　　[ "入力項目1", "入力項目2","入力項目3","チェック", "チェック", "チェック", "リスト1", "リスト2", "リスト3" ];

　　var len = paramArray.length;

　　for(i=0,varChecked=0; i<len; i++) {
　　　　var obj = form.elements[paramArray[i]];
　　　　if(obj.type == "text") {
　　　　　　if(obj.value == "") {
　　　　　　　　alert(alrtArray[i]+"は必須入力です");
　　　　　　　　form.elements[paramArray[i]].focus();
　　　　　　　　return false;
　　　　　　}
　　　　} else if(obj.type == "select-one" || obj.type == "select-multi") {
　　　　　　for(varSelected=0, j=0; j<obj.options.length; j++) {
　　　　　　　　if(obj.options[j].selected)varSelected+=obj.options[j].value;
　　　　　　}
　　　　　　if(varSelected == 0) {
　　　　　　　　alert(alrtArray[i]+"は必須入力です");
　　　　　　　　form.elements[paramArray[i]].focus();
　　　　　　　　return false;
　　　　　　}
　　　　} else if(obj.type == "checkbox") {
　　　　　　if(obj.checked)varChecked++;
　　　　}
　　}
　　if(varChecked == 0) {
　　　　alert(alrtArray[4]+"は必須入力です");
　　　　return false;
　　}

　　form.submit();
}

一応、勝手にＨＴＭＬを作成して確認したので動作はすると思います。

それと、ANo.4の方の回答だと、

＞}else if(obj.type == "checkbox"){
＞　　if(obj[k].checked) varChecked++;
＞}

のkが不定になってしまいます。

追記：
わたしも自前で自分の書き方でソースを起こしましたが、字数制限にひっかかるので公開は控えます。
大分、上記の書き方とは違いますが．．．

お礼

詳しい解答ありがとうございました。
うまくいきました。
これからも何か機会があれば宜しくお願いします。

回答No.4

yambejp

＃１です。
初心者という特権を行使せずもうちょい努力して欲しかった・・・

function hissuCheck(form) {
var paramArray = Array("…24個");
var alrtArray = Array("…24個");
var len = paramArray.length;
var varChecked=0;
for(i=0; i<len; i++) {
var obj = form.elements[paramArray[i]];
if(obj.type == "text") {
if(obj.value == "") {
alert(alrtArray[i]+"は必須入力です");
form.elements[paramArray[i]].focus();
return false;
}
}else if(obj.type == "select-one" || obj.type == "select-multi") {
for(varSelected=0, j=0; j<obj.options.length; j++) {
if(obj.options[j].selected)varSelected+=obj.options[j].value;
}
if(varSelected == 0) {
alert(alrtArray[i]+"は必須入力です");
form.elements[paramArray[i]].focus();
return false;
}
}else if(obj.type == "checkbox"){
if(obj[k].checked) varChecked++;
}
}
if(varChecked == 0) {
alert(alrtArray[i]+"は必須入力です");
return false;
}
return true;
}

かっこの数には自信がありませんが
iの中のforではcheckが１回でもチェックされるのをカウントして
そのループがおわってからcheckが１回もされていなければ
入力必須をアラーとするという考えです。
（って、＃１書いたまんまなんですけど・・・）

回答No.3

神崎 渉瑠（@taloo）

とりあえずソースコードを読んでみましたが、
HTMLや一部必要なコードが省略されているため、全部を確認することが出来ませんが、

> var obj = form.elements[paramArray[i]];
> if(obj.type == "text") {
> （略）
> } else if(obj.type == "select-one" || obj.type == "select-multi") > {
> （略）
> } else {
のあと、

> for(varChecked=0, k=0; k<obj.length; k++) {
> if(obj[k].type == "checkbox") {
> if(obj[k].checked)varChecked++;
> }
> }
の部分ですが、obj（＝form.elements[paramArray[i]]）は何が入ってるのでしょうか？
（checkboxでなければ obj[k].checked が真になることはありません）
alert(k+':'+obj[k].name + ':'+obj[k].value);
などとしてループが何回回っているかとか、objの内容を見てみて下さい。

この仕様だったらelseの中で改めてcheckboxだけループするのではなく、
textやselect-one|select-multiと同じレベルでチェックした方が良いと思いますが。。。

お礼

ご回答ありがとうございます。
> } else {
> for(varChecked=0, k=0; k<obj.length; k++) {
> if(obj[k].type == "checkbox") {
> if(obj[k].checked)varChecked++;
> }
> }
の箇所ですが、elseの後に alert(obj.type)　とやると"checkbox"というアラートが表示されました。
ですがfor文の中にこれを入れると見事にスルーされて
if(varChecked == 0) {
alert(alrtArray[i]+"は必須入力です");
return false;
}
のところまで飛びました…ループ内のことは全く無視されてるようです。又、elseの後にalert(obj.length)と入れると[undefined]と表示されました。for文の条件分内のobj.lengthはだめなのでしょうか？checkboxの数を数えるために何かいいプロパティがあればいいのですが…obj.valueは適切な名前が表示されましたが、for分内の条件文がスルーされてるのでobj[k].value等は確認できませんでした。

回答No.2

dennou2000

通常<form>～</form>には、
<input>タグとしてBUTTON | CHECKBOX | FILE | HIDDEN | IMAGE | PASSWORD | RADIO | RESET | SUBMIT | TEXT
が記述できます。
また、提示されたソースでは、<input>タグのtype=text、<select>タグのselect-multiple／select-one 、その他の
３種類をチェックしています。

ところで、<form>タグですから<input type=submit>が必須のはずです。
これはオブジェクト的にはform.elementsの最後の方にくるでしょう。
つまり、

　　for(i=0; i<len; i++) { // ループＡ
　　　　var obj = form.elements[paramArray[i]];
　　　　　　　　　　　　　：
　　　　} else {
　　　　　　for(varChecked=0, k=0; k<obj.length; k++) { // ループＢ
　　　　　　　　if(obj[k].type == "checkbox") {
　　　　　　　　　　if(obj[k].checked)varChecked++;
　　　　　　　　}
　　　　　　}
　　　　　　if(varChecked == 0) { // チェックＣ
　　　　　　　　alert(alrtArray[i]+"は必須入力です");
　　　　　　　　return false;
　　　　　　}
　　　　}
　　}

において、<input type=submit>がelse節に入る。しかもそのelse節はcheckboxを前提としているので、
checkboxのchecked以外はチェック（カウント）しない。
即ち、<input type=submit>が、varChecked=0としたまま、ループＢを抜けるので、チェックＣに必ず
ひっかかるということではないでしょうか？

必須チェックであれば、入力、選択のあるものだけを厳密に対象として、typeで振り分け、それぞれの
チェック方法を採ればいいと思われます。
入力、選択のないものが必須チェックの中に紛れ込まないようにする必要があります。

お礼

丁寧な回答ありがとうございます。
せっかく説明していただいたのに申し訳ないのですが、
何度も見直したのですがどこが悪いのかよくわかりません…
考え方の根本が間違っているのでしょうか…
dennou2000さんならどういう書き方をしますか？
質問が重複してしまってすいませんが宜しくお願いします。

回答No.1

yambejp

文字数制限のためでしょうけど、中途半端なソースなので
テストができず明確なエラー状況がわかりかねますが、
フローでみるかぎりcheckboxをforでまわしている箇所がいけないと
思います。
checkbox自体は長さをもたないですから。
あくまでもひとつずつ評価していく必要がありそうですね。
iでまわしているforの中ではvarCheckedをインクリメントするだけで
そのループの外側でvarChecked == 0をチェックするのが妥当かと

お礼

ありがとうございます。
すいません、何か具体例とかありませんでしょうか？
ホントに初心者なもので…
すいません