第35回 「複雑な場合の空欄チェック（２）」
前回は「名前＋番号」で参照して空欄チェックを行う方法を説明しました。（以下は前回のプログラム）
<html>
<head>
<title></title>
<script language="JavaScript"><!--
function check()
{
for (i=0; i<5; i++)
{
txt = document.forms[0].elements["DB"+i].value;
if (txt == "")
{
alert("未入力です");
return false;
}
}
return true;
}
// --></script>
</head>
<body>
<form onSubmit="return check()" action="mailto:
[email protected]">
<input type="checkbox"><input type="text" name="DB0"><br>
<input type="text" name="DB1"><br>
<input type="checkbox"><input type="text" name="DB2"><br>
<input type="checkbox"><input type="text" name="DB3"><br>
<input type="text" name="DB4"><br>
<input type="submit" value="送信">
</form>
</body>
</html>
都合良く名前＋番号で指定できれば良いのですが、場合によってはすでに名前が決められていて変更できなかったりcgi側の処理の都合上、変えることができない事があります。そのような場合には別の方法を考える必要があります。
名前が一定しない場合は「配列」に「参照するテキストフィールドの名前」を入れておき参照するようにします。例えば以下のような場合を見てみます。
<input type="checkbox"><input type="text" name="ADRS"><br>
<input type="text" name="NAME"><br>
<input type="checkbox"><input type="text" name="TEL"><br>
<input type="checkbox"><input type="text" name="FAX"><br>
<input type="text" name="REM"><br>
テキストフィールドの名前は
ADRS
NAME
TEL
FAX
REM
の５つになります。これを配列に入れておきます。これは以下のようにします。
fName = ["ADRS","NAME","TEL","FAX","REM"]
これで配列変数fNameに５つの名前が入ります。配列内に入れてしまえばfor命令を使って繰り返し参照していくことができます。また、この方法だと空欄チェックの対象となるテキストフィールドの名前を配列に入れておくだけですみます。
実際のプログラムは以下のようになります。
<html>
<head>
<title></title>
<script language="JavaScript"><!--
function check()
{
fName = ["ADRS","NAME","TEL","FAX","REM"];
for (i=0; i<5; i++)
{
txt = document.forms[0].elements[fName[i]].value;
if (txt == "")
{
alert("未入力です");
return false;
}
}
return true;
}
// --></script>
</head>
<body>
<form onSubmit="return check()" action="mailto:
[email protected]">
<input type="checkbox"><input type="text" name="ADRS"><br>
<input type="text" name="NAME"><br>
<input type="checkbox"><input type="text" name="TEL"><br>
<input type="checkbox"><input type="text" name="FAX"><br>
<input type="text" name="REM"><br>
<input type="submit" value="送信">
</form>
</body>
</html>
最後に注意点としては、古いMac版のNetscapeではテキストフィールド内の文字が全部全角文字だと文字があっても何も入力されていないとみなされるため、上記のような空欄チェックは動作しません。使っている人も少ないので無視しても良いでしょう。
次回はチェックボックスについて説明します。