returnの2つの役割を上手く使って、関数dataCheck()をもっとシンプルに呼び出せるように改善してみましょう。今回はJavaScript側だけの更新です。
【1】「sample010.js」を以下のように更新してください。コピーして貼り付けてもかまいません。
var database;
var txtPrefCd;
var txtPrefName;
onload = init;
onunload = dbClose;
function init() {
//初期設定をする関数
txtPrefCd = document.getElementById("txtPrefCd");
txtPrefName = document.getElementById("txtPrefName");
txtPrefCd.onblur = function (){blur(this);}
txtPrefCd.onfocus = function (){focus(this);}
txtPrefName.onblur = function (){blur(this);}
txtPrefName.onfocus = function (){focus(this);}
document.getElementById("btnInsert").onclick = function (){dataInsert();}
document.getElementById("btnUpdate").onclick = function (){dataUpdate();}
document.getElementById("btnDelete").onclick = function (){dataDelete();}
document.getElementById("linkMaxCd").onclick = function (){return maxCd();}
dbConnect();
dataDisplay();
}
function dbConnect() {
//データベースに接続する関数
database = new ActiveXObject("ADODB.Connection");
database.Open("Driver={Microsoft Access Driver (*.mdb)}; DBQ=c:\\SampleDB010.mdb;");
alert("データベースに接続しました。");
}
function dbClose() {
//データベースを切断する関数
database.Close();
database = null;
alert("データベースを切断しました。");
}
function focus(obj){
obj.style.backgroundColor = "#ffff00";
}
function blur(obj){
obj.style.backgroundColor = "#ffffff";
}
function dataDisplay() {
//データを表示する関数
var mySql = "select * from T01Prefecture order by PREF_CD";
var recordSet = database.Execute(mySql);
var tempText = "";
document.getElementById("dataDisplay").value = "";
while (!recordSet.EOF){
tempText = tempText + recordSet(0) + ":" + recordSet(1) + "\n";
recordSet.MoveNext();
}
document.getElementById("dataDisplay").value = tempText;
recordSet.Close();
recordSet = null;
}
function dataInsert() {
//データを追加する関数
try{
if(dataCheck(1)){
var mySql = "insert into T01Prefecture values(" + Number(txtPrefCd.value) + ",'" + txtPrefName.value + "')";
sqlDisplay(mySql);
database.Execute(mySql);
dataDisplay();
alert("追加しました。");
}
}catch(error){
alert(error.number + "\n" + error.description);
}
}
function dataUpdate() {
//データを更新する関数
if(dataCheck(1)){
var mySql = "update T01Prefecture set PREF_NAME ='" + txtPrefName.value + "' where PREF_CD = " + Number(txtPrefCd.value);
sqlDisplay(mySql);
database.Execute(mySql);
dataDisplay();
alert("更新しました。");
}
}
function dataDelete() {
//データを削除する関数
if(dataCheck(0)){
var mySql = "delete from T01Prefecture where PREF_CD = " + Number(txtPrefCd.value);
sqlDisplay(mySql);
database.Execute(mySql);
dataDisplay();
alert("削除しました。");
}
}
function sqlDisplay(_mySql) {
//SQLを表示する関数
document.getElementById("sqlDisplay").innerHTML = "<p>" + _mySql + "</p>";
}
function dataCheck(flag){
//データをチェックする関数
var tempStr = "は必ず入力してください。";
if (txtPrefCd.value == "") {
alert("PREF_CD" + tempStr);
return false;
}
if (flag == 1 && txtPrefName.value == "") {
alert("PREF_NAME" + tempStr);
return false;
}
return true;
}
function maxCd(){
//最大値を取得する関数
var mySql = "select max(PREF_CD) from T01Prefecture";
var recordSet = database.Execute(mySql);
txtPrefCd.value = recordSet(0) + 1;
txtPrefName.focus();
return false;
}
【2】保存したら sample010.html をダブルクリックしてWebブラウザで開きます。
★sample010.htmlとsample010.jsは必ず同じフォルダ内に置いてください。
【3】前回までと動作が同じだということを確認してください。
【解説】
まず関数dataCheck()の呼び出し方を変更します。前は「テキストボックスの参照」と「文字列」の2つを引数としていましたが、今回は「0か1」の数値だけを引数とするようにしました。0はオフ、1はオンと考えてください。これでかなりシンプルになりましたね。
function dataUpdate() {
省略
if(dataCheck(txtPrefCd,"PREF_CD") && dataCheck(txtPrefName,"PREF_NAME")){
省略
}
}
↓
function dataUpdate() {
省略
if(dataCheck(1)){
省略
}
}
次に関数dataCheck()を変更します。呼び出し元から渡された0か1の値はflagに格納されます。
関数の中ではテキストボックスごとにif文を作り、もしテキストボックスの値が空なら、アラートを表示し、returnでfalseを返しています。ここで重要な点はreturnしたあとのプログラムは実行されないで終了することです。
つまり最初のif文でreturnされると次のif文は判定されません。PREF_CDのデータが空ならPREF_NAMEまでは判定しないということです。
空でなかった場合は何もしないで次のif文に移ります。すべてのif文を通過するとやっとreturnでtrueが返ります。
function dataCheck(flag){
//データをチェックする関数
var tempStr = "は必ず入力してください。";
if (txtPrefCd.value == "") {
alert("PREF_CD" + tempStr);
return false;
}
if (flag == 1 && txtPrefName.value == "") {
alert("PREF_NAME" + tempStr);
return false;
}
return true;
}
trueが返ると呼び出し元ではif(dataCheck(1)){省略}の条件式がtrueとなりますので、更新処理が実行されます。追加、削除でもプログラムの流れは一緒です。
もう一つ重要な点があります。追加、更新ではPREF_CDとPREF_NAMEの両方のデータが入力されている必要がありますが、削除はPREF_CDのチェックだけでかまいません。そこで処理を分けるためPREF_NAMEのif文ではflagが1(オン)の場合のみテキストボックスが空かどうかチェックしています。
if (flag == 1 && txtPrefName.value == "") {省略}
削除の場合は flag == 1 の条件式が 0 == 1 で falseとなるため、後ろの txtPrefName.value == "" は判定されません。
他にもいろいろ方法があり、PREF_CDとPREF_NAMEの両方をチェックしたあとに、まとめてメッセージを表示することもできます。