見出し画像

Re:SALOON & VBA

HTA + Javascript 問合せ票管理

HTAで、もっと何かできないかと(相変わらず暇です)
問合せ・応答票を管理するシステム(と言っていいでしょう)を作りました。

DBは、テストを簡便にしたかったので、ACCESSです。

ACCESSのテーブル1
HTA のファイル3(一覧、更新、追加)です。

複雑なチェック等は入っていません。
出来栄えは、そんなに良くないのですが、折角、何日かかかって作成したので
一応、載せておこうかと・・・いうぐらいので出来です。(ご期待されませんよう!)

***(QABOX_LIST.hta)*********************************************************************************
<html>
<head>
<hta:application navigable="yes" scroll="auto">
<script language="JavaScript" type="text/javascript">
<!--
function go_SubPage(num) {
 location.replace("QABOX_UPD.hta?" + num);
}
function go_NewRec() {
 location.replace("QABOX_INS.hta");
}
function setList() {
 var mySql = "SELECT 質問番号,質問項目,質問者名,format(回答希望日,'YYYY/MM/DD'),文書状況,緊急,分類 FROM T_QABOX ORDER BY 起票日 DESC";
 var cn   = new ActiveXObject("ADODB.Connection");
 cn.Open("Driver={Microsoft Access Driver (*.mdb)};DBQ=G:/My Job/JavaScript/QABOX_DB/QABOX_DB.mdb");
 try {
  var rs  = cn.Execute(mySql);
 } catch (e) {
  cn.Close;
  document.write('検索対象テーブル検索不能');
  alert("検索対象テーブル検索不能");
  return;
 }
 var strDoc = "";
 var tmp  = "";
 var strYMD = "";
 while (!rs.EOF){
  strDoc += '<tr bgcolor=#FFEBCD><td align=center width=80>' + rs(6).value + '</td><td align=center>';
  tmp = rs(5).value;
  if (tmp == "" || tmp == null) {
   strDoc += rs(0).value + '</td><td><img src="spacer.gif" width="13" height="13" alt="緊急"><a href="#" onClick=go_SubPage("' + rs(0).value + '")>';
  } else {
   strDoc += rs(0).value + '</td><td><img src="alerm.gif" width="13" height="13" alt="緊急"><a href="#" onClick=go_SubPage("' + rs(0).value + '")>';
  }
  tmp = rs(2).value;
  if (tmp == null) {
   tmp = "";
  } else {
   if (tmp.indexOf(" ") > 0) {
    tmp = tmp.slice(0,tmp.indexOf(" "));
   }
  }
  strYMD = rs(3).value;
  if (strYMD < '2000/01/01') { strYMD = ""; }
  strDoc += rs(1).value + '</a></td><td align=center>' + tmp + '</td><td align=center>' + strYMD + '</td>';
  tmp = rs(4).value;
  if (tmp == "受付") {
   strDoc += '<td class=recstr  align=middle>' + tmp + '</td></tr>';
  } else if (tmp == "調査中") {
   strDoc += '<td class=norecstr align=middle>' + tmp + '</td></tr>';
  } else {
   strDoc += '<td class=ansstr  align=middle>' + tmp + '</td></tr>';
  }
  rs.MoveNext();
 }
 strDoc += '</table></td></tr></table>'
 document.write(strDoc);
 rs.Close();
 cn.Close();
 rs = null;
 cn = null;
}
// -->
</script>
</head>
<style type="text/css">
.indexstr {color:"#FFFFFF";font-size:10pt;font-weight:bold;font-style:normal;text-align="center";}
.valuestr {color:"#000077";font-size:10pt;font-style:normal;}
.recstr  {color:"darkviolet";font-size:10pt;font-style:normal;text-align="center";}
.norecstr {color:"tomato";font-size:10pt;font-style:normal;text-align="center";}
.ansstr  {color:"midnightblue";font-size:10pt;font-style:normal;text-align="center";}
A:{text-decoration: none }
A:link  {color:"#000077"}
A:active {color:steelblue}
A:visited {color:"#000077"}
A:hover  {color:steelblue}
</style>
<style>
DIV.documentBody
{
Height: 0px ;
Width: 100% ;
overflow: auto ;
}
</style>
<div id="Body" class="documentBody">
<body bgcolor="#8FBC8F">
<p align="right">
<form><input type="button" value="追加する" onClick="go_NewRec()" style="width: 7%; padding: 5px;"></form>
</p>
<table border="0" bgcolor="#FFFFFF" align="center" valign="center" width="95%" height="90%">
<tr valign="top"><td><img src="spacer.gif" width="1px" height="25px"><br>
 <table width="92%" border="0" align="center" valign="abscenter" cellspacing="2" cellpadding="2" class="valuestr">
  <tr><td><img src="spacer.gif" height="1px" width="60px"></td><td><img src="spacer.gif" height="1px" width="100px">
    </td><td><img src="spacer.gif" height="1px" width="200px"></td><td><img src="spacer.gif" height="1px" width="40px"></td>
    <td><img src="spacer.gif" height="1px" width="40px"></td><td><img src="spacer.gif" height="1px" width="40px"></td></tr>
  <tr class="indexstr" bgcolor="#4682B4"><td>分 類</td><td>質問NO</td><td>タイトル</td><td>質問者</td><td>希 望</td><td>状 況</td></tr>
<script>
 setList();
</script>
</body>
</html>

***(QABOX_UPD.hta)**********************************************************************************
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<hta:application navigable="yes" scroll="auto">
<script language="JavaScript" type="text/javascript"><!--
function go_MainPage() {
 location.replace("QABOX_LIST.hta");
}
function setRec() {
 var KeyId = location.search;
 KeyId = KeyId.slice(1);
 var mySql = "SELECT format(更新日,'YYYY/MM/DD'),"
          + "format(起票日,'YYYY/MM/DD HH:MM'),"
          + "format(受付日,'YYYY/MM/DD'),"
          + "format(回答希望日,'YYYY/MM/DD'),"
          + "format(回答日,'YYYY/MM/DD'),*"
       + " FROM T_QABOX";
 if (KeyId != "") {
  mySql += " WHERE 質問番号 = '" + KeyId + "'";
 } else {
  mySql += " ORDER BY 起票日 DESC";
 }
 var cn   = new ActiveXObject("ADODB.Connection");
 cn.Open("Driver={Microsoft Access Driver (*.mdb)};DBQ=G:/My Job/JavaScript/QABOX_DB/QABOX_DB.mdb");
 try {
  var rs  = cn.Execute(mySql);
 } catch (e) {
  cn.Close;
  document.write('検索対象テーブル検索不能');
  alert("検索対象テーブル検索不能");
  return;
 }
 var strDoc = "";
 var tmp  = "";
 var arr  = [];
 var str  = "";
 if (!rs.EOF){
  strDoc += '<tr height="24">'
  strDoc += '<td valign="middle" bgcolor="#E0FFFF" width="120px">文書状況</td><td class="valueCstr" valign="middle">' + rs(9).value + '</td>';
  strDoc += '<td valign="middle" bgcolor="#E0FFFF" width="120px">更 新 日</td><td class="valueCstr">'         + rs(0).value + '</td>';
  strDoc += '<td valign="middle" bgcolor="#E0FFFF" width="120px">起 票 日</td><td class="valueCstr">'         + rs(1).value + '</td>';
  strDoc += '</tr><tr height="24">';
  strDoc += '<td bgcolor="#E0FFFF">質問番号</td><td colspan="3" class="valuestr"> <b>' + rs(5).value + '</b> <input id="monban" type="hidden" value="' + rs(5).value + '"></td>';
  strDoc += '<td bgcolor="#E0FFFF">受 付 日</td><td>'                  + rs(2).value + '</td>'
  strDoc += '</tr><tr height="24">';
  strDoc += '<td bgcolor="#98FB98">所  属</td><td colspan="3" align="left"> <input id="syozok" type="text" value="' + rs(13).value + '" class="inpstr2"></td>';
  strDoc += '<td bgcolor="#98FB98">質問者名</td><td><input id="monjya" type="text" value="' + rs(14).value + '" class="inpstr1"></td>';
  strDoc += '</tr><tr height="24">';
  strDoc += '<td bgcolor="#98FB98">文書区分</td><td><input id="bunkbn" type="text" value="' + rs(12).value + '" class="inpstr1"></td>';
  strDoc += '<td bgcolor="#98FB98">分  類</td><td><input id="bunrui" type="text" value="' + rs(11).value + '" class="inpstr1"></td>';
  strDoc += '<td bgcolor="#98FB98">処理区分</td><td><input id="syokbn" type="text" value="' + rs(15).value + '" class="inpstr1"></td>';
  strDoc += '</tr><tr height="24">';
  strDoc += '<td bgcolor="#98FB98">質問項目</td><td colspan="5" align="left"> <input id="monkou" type="text" value="'  + rs(10).value + '" class="inpstr3"></td>';
  strDoc += '</tr><tr height="24">';
  strDoc += '<td bgcolor="#98FB98">質問内容</td><td colspan="5" align="right"><textarea name="monkbn" cols="110" rows="14" class="inpbox">' + rs(16).value + '</textarea></td>';
  strDoc += '</tr><tr height="24">';
  strDoc += '<td bgcolor="#98FB98">回答希望日</td><td>      <input id="kibobi" type="date" value="'   + rs(3).value + '" class="inpstr1"></td>';
  strDoc += '<td bgcolor="#98FB98">緊急理由 </td><td colspan="3"><input id="kinkyu" type="text" value="'   + rs(18).value + '" class="inpstr2"></td>';
  strDoc += '</tr><tr height="24">';
  strDoc += '<td bgcolor="#98FB98">添付ファイル</td><td colspan="5"><input id="tempf1" type="text" value="' + rs(19).value + '" class="inpstr3"></td>';
  strDoc += '</tr><tr height="24">';
  strDoc += '<td bgcolor="#98FB98">通 信 欄</td><td colspan="5" align="right"><textarea name="tuusin" cols="110" rows="2" class="inpbox">' + rs(20).value + '</textarea></td>'
  strDoc += '</tr><tr height="24">';
  strDoc += '<td bgcolor="#B0C4DE">回答内容</td><td colspan="5" align="right"><textarea name="kaitou" cols="110" rows="14" class="inpbox">' + rs(21).value + '</textarea></td>';
  strDoc += '</tr><tr height="24">';
  strDoc += '<td bgcolor="#B0C4DE">添付ファイル</td><td colspan="5"><input id="tempf2" type="text" value="' + rs(22).value + '" class="inpstr3"></td>';
  strDoc += '</tr><tr height="24">';
  strDoc += '<td bgcolor="#B0C4DE">回 答 日</td><td><input id="kaitbi" type="date" value="' + rs(4).value + '" class="inpstr1"></td>';
  strDoc += '<td bgcolor="#B0C4DE" rowspan="2">備 考</td><td colspan="3" rowspan="2" align="right"><textarea name="bikouu" cols="65" rows="4" class="inpbox">' + rs(25).value + '</textarea></td>';
  strDoc += '</tr><tr height="24">';
  strDoc += '<td bgcolor="#B0C4DE">回 答 者</td><td><input id="kaisya" type="text" value="' + rs(24).value + '" class="inpstr1"></td></tr></table>';
 }
 strDoc = strDoc.replace('null','');
 document.write(strDoc);
 rs.Close();
 cn.Close();
 rs = null;
 cn = null;
}
function updRec() {
 var cn  = new ActiveXObject("ADODB.Connection");
 cn.Open("Driver={Microsoft Access Driver (*.mdb)};DBQ=G:/My Job/JavaScript/QABOX_DB/QABOX_DB.mdb");
 var mySql = "UPDATE T_QABOX SET";
 mySql += " 質問項目     = '" + document.getElementById('monkou').value + "'";
 mySql += ",分類       = '" + document.getElementById('bunrui').value + "'";
 mySql += ",文書区分     = '" + document.getElementById('bunkbn').value + "'";
 mySql += ",所属       = '" + document.getElementById('syozok').value + "'";
 mySql += ",質問者名     = '" + document.getElementById('monjya').value + "'";
 mySql += ",処理区分     = '" + document.getElementById('syokbn').value + "'";
 mySql += ",質問内容     = '" + document.getElementById('monkbn').value + "'";
 mySql += ",回答希望日    = '" + document.getElementById('kibobi').value + "'";
 mySql += ",緊急       = '" + document.getElementById('kinkyu').value + "'";
 mySql += ",添付ファイル   = '" + document.getElementById('tempf1').value + "'";
 mySql += ",通信欄      = '" + document.getElementById('tuusin').value + "'";
 mySql += ",回答内容     = '" + document.getElementById('kaitou').value + "'";
 mySql += ",回答添付ファイル = '" + document.getElementById('tempf2').value + "'";
 mySql += ",回答日      = '" + document.getElementById('kaitbi').value + "'";
 mySql += ",回答者      = '" + document.getElementById('kaisya').value + "'";
 mySql += ",備考       = '" + document.getElementById('bikouu').value + "'";
 var now = new Date();
 mySql += ",更新日      = '" + toLocaleString(now)           + "'";
 mySql += " WHERE 質問番号  = '" + document.getElementById('monban').value + "'";
 try {
  var rs  = cn.Execute(mySql);
  alert("対象テーブル更新完了");
 } catch (e) {
  cn.Close;
  alert("対象テーブル更新失敗 " + e);
  return;
 }
 cn.Close();
 rs = null;
 cn = null;
}
function toLocaleString( date )
{
  return [
    date.getFullYear(),
    date.getMonth() + 1,
    date.getDate()
    ].join( '/' );
}
// -->
</script>
<style type="text/css">
.inpstr1 {color:"#000077";font-size:10pt;font-style:normal;text-align="center";width:120px;border:none;font-family:"HGゴシックM";}
.inpstr2 {color:"#000077";font-size:10pt;font-style:normal;text-align="left";width:360px;border:none;font-family:"HGゴシックM";}
.inpstr3 {color:"#000077";font-size:10pt;font-style:normal;text-align="left";width:610px;border:none;font-family:"HGゴシックM";}
.inpbox  {color:"#000077";font-size:10pt;font-style:normal;text-align="left";border:none;font-family:"HGゴシックM";}
.valuestr {color:"#000077";font-size:10pt;font-style:normal;text-align="left";font-family:"HGゴシックM";}
.valueCstr{color:"#000077";font-size:10pt;font-style:normal;text-align="center";font-family:"HGゴシックM";}
</style>
</head>
<body text="#000000" bgcolor="#8FBC8F">
<form>
 <input type="button" value="一覧へ戻る" onClick="go_MainPage()" style="width: 10%; padding: 10px;">
 <input type="button" value="更新する"  onClick="updRec()"   style="width: 10%; padding: 10px;">
</form>
<p><table bgcolor="#FFFFFF" width="95%" height="90%" align="center"><td valign="top"><br><br>
<table bgcolor="#FFFFFF" width="92%" height="80%" align="center" border="1" cellspacing="0" cellpadding="0" class="valueCstr">
<script>
 window.resizeTo(1100,920);
 setRec();
</script>
</body>
</html>

***(QABOX_INS.hta)**********************************************************************************
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<hta:application navigable="yes" scroll="auto">
<script language="JavaScript" type="text/javascript"><!--
function go_MainPage() {
 location.replace("QABOX_LIST.hta");
}
function insRec() {
 if (document.getElementById('monban').value == "QA-MN-16-") {
  var element = document.getElementById("monban");
  element.focus();
  alert("質問番号を設定して下さい");
  return;
 }
 var cn  = new ActiveXObject("ADODB.Connection");
 cn.Open("Driver={Microsoft Access Driver (*.mdb)};DBQ=G:/My Job/JavaScript/QABOX_DB/QABOX_DB.mdb");
 var mySql = "SELECT * FROM T_QABOX WHERE 質問番号 = '" + document.getElementById('monban').value + "'";
 try {
  var rs  = cn.Execute(mySql);
 } catch (e) {
  cn.Close;
  alert("更新対象テーブル接続不能" + e);
  return;
 }
 if (!rs.EOF){
  cn.Close();
  var element = document.getElementById("monban");
  element.focus();
  alert("既に登録済みの質問番号です!");
  return;
 }
 var mySql = "INSERT INTO T_QABOX VALUES(";
 var tmp  = "";
 mySql += "'" + document.getElementById('monban').value + "',";
 tmp  =    document.getElementById('uketbi').value;
 if (tmp == "") { mySql += "null,"; } else { mySql += "'" + tmp + "',"; }
 tmp  =    document.getElementById('kihybi').value;
 if (tmp == "") { mySql += "null,"; } else { mySql += "'" + tmp + "',"; }
 tmp  =    document.getElementById('kosnbi').value;
 if (tmp == "") { mySql += "null,"; } else { mySql += "'" + tmp + "',"; }
 mySql += "'" + document.getElementById('bunjyo').value + "',";
 mySql += "'" + document.getElementById('monkou').value + "',";
 mySql += "'" + document.getElementById('bunrui').value + "',";
 mySql += "'" + document.getElementById('bunkbn').value + "',";
 mySql += "'" + document.getElementById('syozok').value + "',";
 mySql += "'" + document.getElementById('monjya').value + "',";
 mySql += "'" + document.getElementById('syokbn').value + "',";
 mySql += "'" + document.getElementById('monnai').value + "',";;
 tmp  =    document.getElementById('kibobi').value;
 if (tmp == "") { mySql += "null,"; } else { mySql += "'" + tmp + "',"; }
 mySql += "'" + document.getElementById('kinkyu').value + "',";
 mySql += "'" + document.getElementById('tempf1').value + "',";
 mySql += "'" + document.getElementById('tuusin').value + "',";
 mySql += "'" + document.getElementById('kaitou').value + "',";
 mySql += "'" + document.getElementById('tempf2').value + "',";
 tmp  =    document.getElementById('kaitbi').value;
 if (tmp == "") { mySql += "null,"; } else { mySql += "'" + tmp + "',"; }
 mySql += "'" + document.getElementById('kaisya').value + "',";
 mySql += "'" + document.getElementById('bikouu').value + "')";
 try {
  var rs  = cn.Execute(mySql);
  alert("対象テーブル登録完了");
 } catch (e) {
  cn.Close;
  alert("対象テーブル登録失敗 " + e);
  alert(mySql);
  return;
 }
 cn.Close();
 rs = null;
 cn = null;
}
function toLocaleString( date )
{
  return [
    date.getFullYear(),
    date.getMonth() + 1,
    date.getDate()
    ].join( '/' );
}
// -->
</script>
<style type="text/css">
.inpstr1 {color:"#000077";font-size:10pt;font-style:normal;text-align="center";width:120px;border:none;font-family:"HGゴシックM";}
.inpstr2 {color:"#000077";font-size:10pt;font-style:normal;text-align="left";width:360px;border:none;font-family:"HGゴシックM";}
.inpstr3 {color:"#000077";font-size:10pt;font-style:normal;text-align="left";width:610px;border:none;font-family:"HGゴシックM";}
.inpbox  {color:"#000077";font-size:10pt;font-style:normal;text-align="left";border:none;font-family:"HGゴシックM";}
.valuestr {color:"#000077";font-size:10pt;font-style:normal;text-align="left";font-family:"HGゴシックM";}
.valueCstr{color:"#000077";font-size:10pt;font-style:normal;text-align="center";font-family:"HGゴシックM";}
</style>

// 以下は、コメントに続く(20000文字溢れました。)

コメント一覧

frontflug
ブログオーナー
溢れた分の続き
</head>
<body text="#000000" bgcolor="#8FBC8F">
<form>
 <input type="button" value="一覧へ戻る" onClick="go_MainPage()" style="width: 10%; padding: 10px;">
 <input type="button" value="登録する"  onClick="insRec()"   style="width: 10%; padding: 10px;">
</form>
<p><table bgcolor="#FFFFFF" width="95%" height="90%" align="center"><td valign="top"><br><br>
<table bgcolor="#FFFFFF" width="92%" height="80%" align="center" border="1" cellspacing="0" cellpadding="0" class="valueCstr">
<tr height="24">
 <td bgcolor="#E0FFFF">質問番号</td><td colspan="3" class="valuestr"> <b><input id="monban" type="text" value="QA-MN-16-" class="inpstr1"></b> </td>
 <td bgcolor="#E0FFFF">受 付 日</td><td><input id="uketbi" type="date" value="" class="inpstr1"></td>
</tr><tr height="24">
 <td bgcolor="#E0FFFF" width="120px">文書状況</td><td class="valueCstr" valign="middle"><input id="bunjyo" type="text" value="登録" class="inpstr1"></td>
 <td bgcolor="#E0FFFF" width="120px">更 新 日</td><td class="valueCstr"><input id="kosnbi" type="date" value="" class="inpstr1"></td>
 <td bgcolor="#E0FFFF" width="120px">起 票 日</td><td class="valueCstr"><input id="kihybi" type="date" value="" class="inpstr1"></td>
</tr><tr height="24">
 <td bgcolor="#98FB98">所  属</td><td colspan="3" align="left"> <input id="syozok" type="text" value="" class="inpstr2"></td>
 <td bgcolor="#98FB98">質問者名</td><td><input id="monjya" type="text" value="" class="inpstr1"></td>
</tr><tr height="24">
 <td bgcolor="#98FB98">文書区分</td><td><input id="bunkbn" type="text" value="" class="inpstr1"></td>
 <td bgcolor="#98FB98">分  類</td><td><input id="bunrui" type="text" value="" class="inpstr1"></td>
 <td bgcolor="#98FB98">処理区分</td><td><input id="syokbn" type="text" value="" class="inpstr1"></td>
</tr><tr height="24">
 <td bgcolor="#98FB98">質問項目</td><td colspan="5" align="left"> <input id="monkou" type="text" value="" class="inpstr3"></td>
</tr><tr height="24">
 <td bgcolor="#98FB98">質問内容</td><td colspan="5" align="right"><textarea name="monnai" cols="110" rows="14" class="inpbox"></textarea></td>
</tr><tr height="24">
 <td bgcolor="#98FB98">回答希望日</td><td>      <input id="kibobi" type="date" value="" class="inpstr1"></td>
 <td bgcolor="#98FB98">緊急理由 </td><td colspan="3"><input id="kinkyu" type="text" value="" class="inpstr2"></td>
</tr><tr height="24">
 <td bgcolor="#98FB98">添付ファイル</td><td colspan="5"><input id="tempf1" type="file" value="" class="inpstr3"></td>
</tr><tr height="24">
 <td bgcolor="#98FB98">通 信 欄</td><td colspan="5" align="right"><textarea name="tuusin" cols="110" rows="2" class="inpbox"></textarea></td>
</tr><tr height="24">
 <td bgcolor="#B0C4DE">回答内容</td><td colspan="5" align="right"><textarea name="kaitou" cols="110" rows="14" class="inpbox"></textarea></td>
</tr><tr height="24">
 <td bgcolor="#B0C4DE">添付ファイル</td><td colspan="5"><input id="tempf2" type="file" value="" class="inpstr3"></td>
</tr><tr height="24">
 <td bgcolor="#B0C4DE">回 答 日</td><td><input id="kaitbi" type="date" value="" class="inpstr1"></td>
 <td bgcolor="#B0C4DE" rowspan="2">備 考</td><td colspan="3" rowspan="2" align="right"><textarea name="bikouu" cols="65" rows="4" class="inpbox"></textarea></td>
</tr><tr height="24">
 <td bgcolor="#B0C4DE">回 答 者</td><td><input id="kaisya" type="text" value="" class="inpstr1"></td>
</tr></table>
<script>
 window.resizeTo(1100,920);
 var now = new Date();
 document.getElementById('uketbi').value = toLocaleString(now);
 document.getElementById('kihybi').value = toLocaleString(now) + ' ' + now.toLocaleTimeString();
 document.getElementById('kosnbi').value = toLocaleString(now);
</script>
</body>
</html>
名前:
コメント:

※文字化け等の原因になりますので顔文字の投稿はお控えください。

コメント利用規約に同意の上コメント投稿を行ってください。

 

※ブログ作成者から承認されるまでコメントは反映されません。

  • Xでシェアする
  • Facebookでシェアする
  • はてなブックマークに追加する
  • LINEでシェアする

最新の画像もっと見る

最近の「HTA」カテゴリーもっと見る

最近の記事
バックナンバー
人気記事