プロが教える店舗＆オフィスのセキュリティ対策術

プルダウンの必須チェックができない

解決済

  • 質問者：pgBeginImo
  • 質問日時：
  • 回答数：7件

今必須チェックのスクリプトを組んでいます。
プルダウン項目の必須チェックを行っているところで、項目を選択しても「必須入力です」というアラートが出てしまいます。
ソースは以下参照です
<!--
function hissuCheck(frm) {
/* 必須入力のname属性 */
var paramArray = Array(23個あるが字数制限のため省略)

/* 必須入力アラート用 */
var alrtArray = Array(23個あるが字数制限のため省略);
/* 配列長 */
var len = paramArray.length;
for(i=0; i<len; i++) {
var obj = frm.elements[paramArray[i]];
if(obj.type == "text") {
if(obj.value == "") {
alert(alrtArray[i]+"は必須入力です");
frm.elements[paramArray[i]].focus();
return false;
}
} else if (obj.type == "select") {
for(varSelected=0, j=0; j<obj.length; j++) {
/*選択されていたらvarSelectedフラグをプラス*/
if(obj[j].selected)varSelected++;
}
if(varSelected == "") {
alert(alrtArray[i]+"は必須入力です");
return false;
}
} else {
for(varChecked=0, k=0; k<obj.length; k++) {
.....以下省略
}
}
}
return true;
}
// -->
HTML箇所も書きたかったのですが、ちょっとソースが長くなってご迷惑をおかけしてしまうと思い、割愛させて頂きました。
もし必要であれば一言頂ければと思います。

忙しい中すいませんが、どなたかご教授宜しくお願いします。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (7件)

No.6ベストアンサー

  • 回答者： Kuppycat
  • 回答日時：

＃４，５です。


for(varChecked=0, k=0; k<obj.length; k++)の前にalert(obj[0].type);をいれて、まずオブジェクトが確実に参照されているか確認してみてください。

こちらで試したものはうまくいきました。
サンプル載せときます。
インデントは全角空白で置き換えてますのでご注意ください。
----------
<html>
<head>
<title> 必須チェック </title>
<script type="text/javascript">
<!--
function hissuCheck(frm) {
/* 必須入力のname属性 */
var paramArray = Array("txt","color1","color2");
/* 必須入力アラート用 */
var alrtArray = Array("txt","color1","color2");
/* 配列長 */
var len = paramArray.length;
for(i=0; i<len; i++) {
　var obj = frm.elements[paramArray[i]];
　alert(obj.type);
　if(obj.type == "text") {
　　if(obj.value == "") {
　　　alert(alrtArray[i]+"は必須入力です");
　　　frm.elements[paramArray[i]].focus();
　　　return false;
　　}
　} else if (obj.type == "select-one" || obj.type == "select-multi") {
　　for(varSelected="", j=0; j<obj.options.length; j++) {
　　　if(obj.options[j].selected)varSelected+=obj.options[j].value;
　　}
　　if(varSelected == "") {
　　　alert(alrtArray[i]+"は必須入力です");
　　　return false;
　　}
　} else {
　　alert(obj[0].type);
　　for(varChecked=0, k=0; k<obj.length; k++) {
　　　if(obj[k].type == "checkbox") {
　　　　/*選択されていたらvarCheckedフラグをプラス*/
　　　　if(obj[k].checked)varChecked++;
　　　}
　　}
　　alert(varChecked);
　　if(varChecked == 0) {
　　　alert(alrtArray[i]+"は必須入力です");
　　　return false;
　　}
　}
}
return false;
}
// -->
</script>
</head>
<body>
<form onsubmit="hissuCheck(this);">
<p><input type="text" name="txt" /></p>
<p>
<select name="color1">
<option value="">-- 選択してください --</option>
<option value="白">ホワイト</option>
<option value="赤">レッド</option>
<option value="黄">イエロー</option>
<option value="青">ブルー</option>
<option value="緑">グリーン</option>
</select>
</p>
<p>
<input type="checkbox" name="color2" value="白">ホワイト</input>
<input type="checkbox" name="color2" value="赤">レッド</input>
<input type="checkbox" name="color2" value="黄">イエロー</input>
<input type="checkbox" name="color2" value="青">ブルー</input>
<input type="checkbox" name="color2" value="緑">グリーン</input>
</p>
<p><input type="submit" value="送信する"></p>
</form>
</body>
</html>
----------
    • good
    • 0
    • 件
通報する
この回答へのお礼

いつもありがとうございます。
>for(varChecked=0, k=0; k<obj.length; k++)の前にalert(obj[0].type);をいれて、まずオブジェクトが確実に参照されているか確認してみてください。

確認してみたところアラートは表示されず、for文等はスルーされて送信されてしまいました。っていうことはオブジェクトがうまく参照できてないってことでしょうか。Kuppycatさんとのソースを比較してもあまり違いがないような気がするのですが…

通報する
お礼日時：2006/11/16 17:41

No.7

<form onsubmit="REQUIREDCheck(this);">


<fieldset>
<legend>テキスト入力</legend>
<fieldset>
<legend>任意</legend>
<input type="text" name="txt0">
<input type="text" name="txt1">
</fieldset>
<fieldset>
<legend>必須</legend>
<input type="text" name="txt2">
<input type="text" name="txt3">
</fieldset>
</fieldset>

<fieldset>
<legend>選択項目</legend>
<select name="select0">
<option value="">必須</option>
<option value="0">項目0</option>
<option value="1">項目1</option>
<option value="2">項目2</option>
</select>
<select name="select1">
<option value="">任意</option>
<option value="0">項目0</option>
<option value="1">項目1</option>
<option value="2">項目2</option>
</select>
</fieldset>

<fieldset>
<legend>チェック項目</legend>
<fieldset>
<legend>任意</legend>
<input type="checkbox" name="check0" value="0">項目0
<input type="checkbox" name="check0" value="1">項目1
<input type="checkbox" name="check0" value="2">項目2
</fieldset>
<fieldset>
<legend>必須</legend>
<input type="checkbox" name="check1" value="0">項目0
<input type="checkbox" name="check1" value="1">項目1
</fieldset>

<fieldset>
<legend>チェック項目</legend>
<fieldset>
<legend>任意</legend>
<input type="radio" name="radio0" value="0">項目0
<input type="radio" name="radio0" value="1">項目1
<input type="radio" name="radio0" value="2">項目2
</fieldset>
<fieldset>
<legend>必須</legend>
<input type="radio" name="radio1" value="0">項目0
<input type="radio" name="radio1" value="1">項目1
</fieldset>

</fieldset>

<p><input type="submit" value="送信する"></p>
</form>
<script>
REQUIRED = new Array('txt2','txt3','select0','check1','radio1')
function REQUIREDCheck(Form){
for(var i=0;i<REQUIRED.length;i++){
if(REQUIRED[i].indexOf('txt') != -1){
if(Form.elements[REQUIRED[i]].value == ""){alert(REQUIRED[i]+'は必須です')}
}else if(REQUIRED[i].indexOf('select') != -1){
if(Form.elements[REQUIRED[i]].value == ""){alert(REQUIRED[i]+'は必須です')}
}else if(REQUIRED[i].indexOf('check') != -1){
flag=false
for(var j=0;j<Form.elements[REQUIRED[i]].length;j++){
if(Form.elements[REQUIRED[i]][j].checked){flag=true}
}
if(!flag){alert(REQUIRED[i]+'は必須です')}
}else if(REQUIRED[i].indexOf('radio') != -1){
flag=false
for(var j=0;j<Form.elements[REQUIRED[i]].length;j++){
if(Form.elements[REQUIRED[i]][j].checked){flag=true}
}
if(!flag){alert(REQUIRED[i]+'は必須です')}
}
}
}
</script>
    • good
    • 0
    • 件
通報する

No.5

  • 回答者： Kuppycat
  • 回答日時：

＃４です。



チェックボックスのほうですが、

if(obj.type == "checkbox") {

を

if(obj[k].type == "checkbox") {

に変えてください。
forで回してるカウンタをインデックスに付けないと"undefined"になっちゃいますよ。
    • good
    • 0
    • 件
通報する
この回答へのお礼

早速の返事ありがとうございます～～！
ご指摘どおりに変更してみたのですが、２・３・・・・・個チェックつけても「必須です」というアラートが出てしまいます。
まさにセレクトの箇所と同じ症状です…
せっかく回答頂いたのにすいません…

通報する
お礼日時：2006/11/15 23:14

No.4

  • 回答者： Kuppycat
  • 回答日時：

Valueで見たらどうでしょうか。



for(varSelected=0, j=0; j<obj.options.length; j++) {
/*選択されていたらvarSelectedフラグをプラス*/
if(obj[j].selected)varSelected++;
}

を

for(varSelected="", j=0; j<obj.options.length; j++) {
if(obj.options[j].selected)varSelected+=obj.options[j].value;
}

と変えてみてください。

あと、試した<Selete>のサンプルを以下に書いておきます。
----------
<select name="color1">
<option value="">-- 選択してください --</option>
<option value="白">ホワイト</option>
<option value="赤">レッド</option>
<option value="黄">イエロー</option>
<option value="青">ブルー</option>
<option value="緑">グリーン</option>
</select>
----------
    • good
    • 0
    • 件
通報する
この回答へのお礼

ありがとうございます！
うまくいきました～～！！！なんとお礼を言えばいいのか…ホントに一日中悩んでいたので…
ですがセレクトの必須チェックの後にチェックボックスの必須チェックをする予定なのですが、それもうまくいってませんでした…（泣
最初に投稿したソースの「以下省略部分」を追記します

}
} else {
for(varChecked=0, k=0; k<obj.length; k++) {
if(obj.type == "checkbox") {
/*選択されていたらvarCheckedフラグをプラス*/
if(obj[k].checked)varChecked++;
}
}
if(varChecked == 0) {
alert(alrtArray[i]+"は必須入力です");
return false;
}
どこかおかしい箇所ありますでしょうか？
質問が重なってしまって申し訳ないですが宜しくお願いします

通報する
お礼日時：2006/11/15 02:35

No.3

  • 回答者： steel_gray
  • 回答日時：

色々書いてかえってわかりづらくしてしまったようで。



if (obj.type == "select")
これを
if(obj.type == "select-one" || obj.type == "select-multi")
と、変更してください。
    • good
    • 0
    • 件
通報する
この回答へのお礼

いつも早い返事ありがとうございます。
すいません、うまくいかないようです。
次はセレクトボタンのチェックをスルーしていきなりチェックボックスのチェックを行うようになってしまいました…
どうしたらよいのでしょうか…

通報する
お礼日時：2006/11/14 01:51

No.2

  • 回答者： steel_gray
  • 回答日時：

obj.type=="select" という判定も間違っていました。


その為 else ～.....以下省略 の部分が動作しているようです。

selectの場合は<select>のmultiple属性の指定によって
obj.type == "select-one" または
obj.type == "select-multi" または
obj.type.match("^select-")
と、判定する必要があるようです。
http://1106.suac.net/johoB/JavaScript/jscripts.h …
    • good
    • 0
    • 件
通報する
この回答へのお礼

ありがとうございます。
３通りのパターンを記述してやらないとだめってことでしょうか？
何か例みたいなものがあるとわかりやすいのですが…
すいません、googleとかで調べてみたんですがわかりませんでした

通報する
お礼日時：2006/11/13 00:10

No.1

  • 回答者： steel_gray
  • 回答日時：

select項目のチェックをするforループがおかしいです。


select オブジェクトの子要素であるoptionsの内容を調べてチェックすれば大丈夫だと思います。

for(varSelected=0, j=0; j<obj.options.length; j++) {
if(obj.options[j].selected)varSelected++;
    • good
    • 0
    • 件
通報する
この回答へのお礼

早速の返事ありがとうございます。

ご指摘どおりに修正して変更してみたのですが…
無理でした。
選択しても「選択してください」という旨のアラートが出てしまいます。ってことは選択したことを認識していないということになりますよね…なぜなんでしょうか…

通報する
お礼日時：2006/11/12 01:02

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

ページトップページトップ

Q質問する（無料）

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報