スポンサードリンク

明細 削除

明細の削除は関数dataDeleteDetails()で行います。データをチェックする関数dataCheckDetails()は追加の時と同じものを使います。削除はSQL文も簡単なのでもうひといきです。

【1】以下のように details.js を更新します。他は前回までと同じです。

details.js

var txtAmount;
var txtMemo;
var selectSlip;
var selectGoods;

onload = init;
onunload = dbClose;

function init() {
  //初期設定をする関数
  txtAmount = document.getElementById("txtAmount");
  txtMemo = document.getElementById("txtMemo");

  txtAmount.onfocus = function (){focus(this);}
  txtAmount.onblur = function (){blur(this);}
  txtMemo.onfocus = function (){focus(this);}
  txtMemo.onblur = function (){blur(this);}

  document.getElementById("btnInsertDetails").onclick = function (){dataInsertDetails();}
  document.getElementById("btnUpdateDetails").onclick = function (){dataUpdateDetails();}
  document.getElementById("btnDeleteDetails").onclick = function (){dataDeleteDetails();}
  document.getElementById("linkNewDetails").onclick = function (){return newDetails();}

  dbConnect();
  slipDisplay();
  goodsDisplay();
}


function focus(obj){
  obj.style.backgroundColor = "#ffff00";
}


function blur(obj){
  obj.style.backgroundColor = "#ffffff";
}


function slipDisplay() {
  //伝票を表示する関数

  var mySql = "select SLIP_CD,SLIP_DATE from T07Slip order by SLIP_CD";
  var recordSet = database.Execute(mySql);

  document.getElementById("slipDisplay").innerHTML = "";

  var tempHtml = "<select name=\"selectSlip\" id=\"selectSlip\">\n";
  tempHtml = tempHtml + "\t<option value=\"0\">選択してください。</option>\n";
  while (!recordSet.EOF){
    tempHtml = tempHtml + "\t<option value=\"" + recordSet(0) + "\">" + "伝票番号" + recordSet(0) + " 日付" + dateFormat(recordSet(1)) + "</option>\n";
    recordSet.MoveNext();
  }
  tempHtml = tempHtml + "</select>";

  //alert(tempHtml);
  document.getElementById("slipDisplay").innerHTML = tempHtml;
  selectSlip = document.getElementById("selectSlip");
  selectSlip.onchange = function (){slipChange(this);}

  recordSet.Close();
  recordSet = null;
}


function slipChange(obj) {
  //伝票を選択した時の関数
  if(obj.selectedIndex==0){
    textClearDetails();
    goodsDisplay();
    document.getElementById("detailsDisplay").innerHTML = "";
    document.getElementById("sqlDisplay").innerHTML = "";
    alert("伝票を選択してください。");
  }else{
    textClearDetails();
    goodsDisplay();
    detailsDisplay();
    sqlDisplay("selectedIndex:" + obj.selectedIndex + " value:" + obj.value);
  }
}


function detailsDisplay() {
  //明細を表示する関数
  var mySql = "select DETAILS_CD,SLIP_CD,GOODS_NAME,PRICE,AMOUNT,MEMO ";
  mySql = mySql + "from T08Details,T06Goods ";
  mySql = mySql + "where T08Details.GOODS_CD = T06Goods.GOODS_CD ";
  mySql = mySql + "and SLIP_CD = " + selectSlip.value;
  mySql = mySql + " order by DETAILS_CD";
  var recordSet = database.Execute(mySql);

  document.getElementById("detailsDisplay").innerHTML = "";

  var tempHtml = "<select size=\"10\" name=\"selectDetails\" id=\"selectDetails\">\n";
  while (!recordSet.EOF){
    tempHtml = tempHtml + "\t<option value=\"" + recordSet(0) + "\">";
    tempHtml = tempHtml +"[DETAILS_CD]:" + recordSet(0) + " [SLIP_CD]:" + recordSet(1);
    tempHtml = tempHtml + " [GOODS_NAME]:" + recordSet(2) + " [PRICE]:" + recordSet(3);
    tempHtml = tempHtml + " [AMOUNT]:" + recordSet(4) + " [MEMO]:" + recordSet(5);
    tempHtml = tempHtml + "</option>\n";
    recordSet.MoveNext();
  }
  tempHtml = tempHtml + "</select>";

  //alert(tempHtml);
  document.getElementById("detailsDisplay").innerHTML = tempHtml;
  document.getElementById("selectDetails").onchange = function (){detailsChange(this);}

  recordSet.Close();
  recordSet = null;
}


function detailsChange(obj) {
  //明細を選択した時の関数
  var mySql = "select GOODS_CD,AMOUNT,MEMO ";
  mySql = mySql +"from T08Details ";
  mySql = mySql +"where Details_CD = " + obj.value ;
  var recordSet = database.Execute(mySql);

  selectGoods.selectedIndex = goodsIndexSearch(recordSet(0));
  txtAmount.value = recordSet(1);
  txtMemo.value = recordSet(2);

  recordSet.Close();
  recordSet = null;

  sqlDisplay("selectedIndex:" + obj.selectedIndex + " value:" + obj.value);

}


function goodsDisplay() {
  //商品を表示する関数

  var mySql = "select GOODS_CD,GOODS_NAME from T06Goods order by GOODS_CD";
  var recordSet = database.Execute(mySql);

  document.getElementById("goodsDisplay").innerHTML = "";

  var tempHtml = "<select name=\"selectGoods\" id=\"selectGoods\">\n";
  tempHtml = tempHtml + "\t<option value=\"0\">選択してください。</option>\n";
  while (!recordSet.EOF){
    tempHtml = tempHtml + "\t<option value=\"" + recordSet(0) + "\">" + recordSet(1) + "</option>\n";
    recordSet.MoveNext();
  }
  tempHtml = tempHtml + "</select>";

  //alert(tempHtml);
  document.getElementById("goodsDisplay").innerHTML = tempHtml;
  selectGoods = document.getElementById("selectGoods");
  selectGoods.onchange = function (){goodsChange(this);}

  recordSet.Close();
  recordSet = null;
}


function goodsChange(obj) {
  //商品を選択した時の関数

  if(obj.selectedIndex==0){
    document.getElementById("sqlDisplay").innerHTML = "";
    alert("商品を選択してください。");
  }else{
    sqlDisplay("selectedIndex:" + obj.selectedIndex + " value:" + obj.value);
  }

}


function sqlDisplay(_mySql) {
  //SQLを表示する関数
  document.getElementById("sqlDisplay").innerHTML = "<p>" + _mySql + "</p>";
}


function newDetails(){
  //明細を新規作成する関数
  textClearDetails();
  document.getElementById("sqlDisplay").innerHTML = "";
  goodsDisplay();
  detailsDisplay();
  selectGoods.focus();
  return false;
}


function textClearDetails() {
  //テキストボックスをクリアする関数
  txtAmount.value = "";
  txtMemo.value = "";
}


function dataInsertDetails() {
  //データを追加する関数

  try{
    if(dataCheckDetails(1)){
      var mySql = "insert into T08Details(SLIP_CD,GOODS_CD,AMOUNT,MEMO) ";
      mySql = mySql + "values(";
      mySql = mySql + Number(selectSlip.value) + ",";
      mySql = mySql + Number(selectGoods.value) + ",";
      mySql = mySql + Number(txtAmount.value) + ", '";
      mySql = mySql + txtMemo.value + "'";
      mySql = mySql +")";

      sqlDisplay(mySql);
      database.Execute(mySql);
      detailsDisplay();
      alert("追加しました。");

    }
  }catch(error){
    alert(error.number + "\n" + error.description);
  }
}


function dataUpdateDetails() {
  //データを更新する関数
  if(dataCheckDetails(1)){
    var mySql = "update T08Details set ";
    mySql = mySql + "GOODS_CD = " + Number(selectGoods.value);
    mySql = mySql + ",AMOUNT = " + Number(txtAmount.value);
    mySql = mySql + ",MEMO = '" + txtMemo.value + "'";
    mySql = mySql + " where Details_CD = " + Number(selectDetails.value);
    sqlDisplay(mySql);
    database.Execute(mySql);
    detailsDisplay();
    alert("更新しました。");
  }
}


function dataDeleteDetails() {
  //データを削除する関数
  if(!confirm("本当に削除しますか?")){
    return ;
  }

  if(dataCheckDetails(0)){
    var mySql = "delete from T08Details where Details_CD = " + Number(selectDetails.value);
    sqlDisplay(mySql);
    database.Execute(mySql);
    textClearDetails();
    detailsDisplay();
    goodsDisplay();
    alert("削除しました。");
  }
}


function dataCheckDetails(flag){
  //データをチェックする関数
  var tempStr = "は必ず入力してください。";

  if (flag == 1 && selectGoods.value == 0) {
    alert("GOODS_CD" + "は必ず選択してください。");
    return false;
  }
  if (flag == 1 && txtAmount.value == "") {
    alert("AMOUNT" + tempStr);
    return false;
  }
  if (flag == 1 && txtAmount.value.match(/[^0-9]/)) {
    alert("AMOUNTには半角数字を入力してください!");
    txtAmount.focus();
    return false;
  }
  if (flag == 1 && txtMemo.value == "") {
    alert("Memo" + tempStr);
    return false;
  }

  return true;
}


function goodsIndexSearch(goodsCd){
  //商品選択ボックスのIndexを検索する関数
  var mySql = "select count(GOODS_CD) from (select GOODS_CD from T06Goods where GOODS_CD <= " + goodsCd + " order by GOODS_CD)";
  var recordSet = database.Execute(mySql);
  var goodsIndex = recordSet(0);
  return goodsIndex;
}



【2】保存したら details.html をダブルクリックしてWebブラウザで開きます。

★details.html、base.css、details.css、database.js、details.js は必ず同じフォルダ内に置いてください。

★動作確認前にテーブルT08Detailsにある最後のフィールド名が「NOTE」になっている場合は、SampleDB010.zipをダウンロードし直してください。すでに「MEMO」になっている場合は修正後のデータベースなので、そのままでかまいません。


【3】明細が表示されました。

javascript-192.gif


【4】伝票選択ボックスから伝票番号「23」を選んでください。

javascript-193.gif


【5】更新のときに練習で入力したレコードがあることを確認してください。なければどのレコードでもかまいません。

javascript-215.gif


【6】DETAILS_CD「63」をクリックします。

javascript-216.gif


【7】このとき明細選択ボックスのvalueは「63」になっています。削除ではこの値を使います。

javascript-217.gif


【8】「明細削除」ボタンをクリックします。

javascript-224.gif


【9】確認メッセージが表示されますので、「OK」をクリックします。
javascript-218.gif

javascript-219.gif


【10】削除しましたというメッセージが表示されました。

javascript-220.gif


【11】明細のレコードが1件削除されました。

javascript-221.gif


【12】削除のSQL文が正しく作成されていることを確認してください。

javascript-222.gif


【13】データベースSampleDB010.mdbのテーブルT08Detailsをデータシートビューで開き、データが削除されていることを確認します。

javascript-223.gif


【解説】

(1)関数dataDeleteDetails()では削除のSQL文を作成し、データを削除しています。

削除の時はDETAILS_CDが重要です。DETAILS_CDは明細選択ボックスの値を使います。値は「selectDetails.value」で取得できます。

*必ず選択ボックスで選択してから「明細削除」ボタンをクリックしてください。選択しないで削除しようとするとエラーになります。


【SQL文の組み立て方】

最終的に組み立てたいSQL文です。
delete from T08Details where Details_CD = 63

全体を「"」(ダブルクォーテーション)で囲みます。
"delete from T08Details where Details_CD = 63"

値をコントロールや変数に置き換えます。
"delete from T08Details where Details_CD = Number(selectDetails.value)"

コントロールや変数の前後に半角空白を入れ切り離します。
"delete from T08Details where Details_CD = Number(selectDetails.value) "

コントロールや変数以外の文字列部分を「"」(ダブルクォーテーション)で囲みます。
"delete from T08Details where Details_CD =" Number(selectDetails.value)

コントロールや変数と文字列を「+」で結合します。
"delete from T08Details where Details_CD =" + Number(selectDetails.value)

変数mySqlに代入して1行のプログラムの終わりをあらわす「;」(セミコロン)を付けます。
var mySql = "delete from T08Details where Details_CD =" + Number(selectDetails.value);


スポンサードリンク






JavaScript初心者入門講座TOPへ