::: newtype의 지식창고 :::

// 결과를 보여줄 영역을 동적 생성
function getMsgElement()
{
    var id = 'result';
    var element = $(id);

      if ( !element || Object.isUndefined(element) )
      {
          element=document.createElement('DIV');
          element.setAttribute('ID', id);
          document.body.appendChild(element);
      }

      return element;
};


// 에러 메시지 출력
function writeErrorMsg(msg)
{
    var eResult = getMsgElement();
      var eError = document.createElement('div');
      eError.className='error';

      eResult.appendChild(eError);
     Element.insert(eError, Object.toHTML(msg + '<br/>'));
};

// 일반 메시지 출력
function writeMsg(msg)
{
      var eResult = getMsgElement();

    Element.insert(eResult, Object.toHTML(msg + '<br/>'));
};

// 처리중 모래시계를 element 앞에 삽입
function beginWaiting(element)
{
    var elementImage;
    var next = element;
    var id = element.id + 'WaitingImage';
    element = $(id);
   
    if ( !element || Object.isUndefined(element) )
    {
         element = document.createElement('IMG');
        element.setAttribute('id', id);
        element.setAttribute('src', '../images/waiting.gif');
        
        next.parentNode.insertBefore(element, next);
    }
};

// 처리중 모래시계를 지운다.
function endWaiting(element)
{
    var parent = element.parentNode;
    var id = element.id + 'WaitingImage';
    element = $(id);
   
    if ( !element || Object.isUndefined(element) )    return;
   
    parent.removeChild(element);
};


// select에 OPTION 태그를 추가한다.
function addOption(parent, value, text)
{
    var element = document.createElement('OPTION');
    element.value = value;
    element.text = text;

    if ( !parent || Object.isUndefined(parent) ) return;

    try {
        parent.add(element, null);        // from standard
    } catch(ex) {
        parent.add(element);            // from IE
    }
}

// option용 데이타를 서버 요청(prototype ajax class)
var FillOptions = Class.create();
FillOptions.prototype = {
    initialize: function(url, field, key) {
        this.url = url;
        this.field = field;
        this.key = key;
        this.tryReq = false;
    },
    addOption: function(value, text) {
        addOption( $(this.field), value, text );
    },
    beginWaiting: function() {
        this.tryReq = true;
        beginWaiting($(this.field));
    },
    endWaiting: function() {
        this.tryReq = false;
        endWaiting($(this.field));
    },
    run: function() {
        if ( $(this.field).firstChild ) return;

        if ( this.tryReq == true )
        {
            writeErrorMsg('승질은!, 요청 중.. 잠시만 기둘리삼');
            return;
        }
        this.beginWaiting();

        new Ajax.Request(this.url,
            {
                method:'post',
                parameters: { field:this.field, key:this.key },
                onSuccess:this.onSucc.bind(this),
                onFailure:this.onFail.bind(this)
            }
        );
    },
    onSucc: function(transport) {
          var response = transport.responseText || '';
          var list = response.split('\n');                 // record separator
          if ( list[0] == 'OK' )
          {
              // callback function 'beforeOption' check
              if ( Object.isFunction(parent.beforeOption) )
              {
                  beforeOption($(this.field));
              }

            for(i=1; i<list.length; i++)
            {
                var record = list[i].split('\t');        // field separator
                this.addOption(record[0], record[1]);
            }

              // callback function 'afterOption' check
              if ( Object.isFunction(parent.afterOption) )
              {
                  afterOption($(this.field));
              }

          } else {
            writeErrorMsg(response);
          }
          this.endWaiting();
    },
    onFail: function() {
        writeErrorMsg('요청 실패!');
        this.endWaiting();
    }
};

//오늘 날짜를 리턴 한다.
function getDate()
{
    var szResult;
    var today=new Date();
   
    szResult = today.getFullYear() + "-";
   
    if ( today.getMonth() < 10 )    szResult += "0" + (today.getMonth() + 1);
    else                            szResult += (today.getMonth() + 1);
       
    szResult += "-";
       
    if ( today.getDate() < 10 )    szResult += "0" + today.getDate();
    else                        szResult += today.getDate();
       
    return szResult;
}

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>목록</title>
<link rel="stylesheet" href="../css/style.css">
<link rel="stylesheet" type="text/css" media="all" href="http://newtype.pe.kr/jscalendar-1.0/skins/aqua/theme.css" title="Aqua" />
<script  type="text/javascript" src="../js/prototype.js">
/*http://prototypejs.org/*/
</script>
<script type="text/javascript" src="../js/jscalendar-1.0/calendar.js"></script>
<script type="text/javascript" src="../js/jscalendar-1.0/lang/calendar-ko-utf8.js"></script>
<script type="text/javascript" src="../js/jscalendar-1.0/calendar-setup.js"></script>

<script type="text/javascript" src="./common.js"></script>
<script language="javascript">

    var isTry = false;
    var cName = new FillOptions('./fund_list.php', 'name', 'seq');
    var cScope = new FillOptions('./fund_list.php', 'scope', 'scope');
    var cType = new FillOptions('./fund_list.php', 'type', 'type');
    var cCompany = new FillOptions('./fund_list.php', 'company', 'company');

    function beforeOption(oSel)
    {
        addOption(oSel, "All", "모두" );
    }

    function init()
    {
        cName.run();
        cScope.run();
        cType.run();
        cCompany.run();
       
        $('startDate').value = '2005-01-01';
        $('endDate').value = getDate();
    }

    function doRequest()
    {
        var element = $('timer');
       
        if ( isTry == true )
        {
            writeErrorMsg("승질은!, 요청중.. 잠시만 기둘리삼");
            return;
        }

        isTry = true;
        beginWaiting(element);

        new Ajax.Request('./process.php',
            {
                method:'post',
                parameters: { fundpk:    $F("name"),
                              scope:     $F("scope"),
                              type:      $F("type"),
                              company:   $F("company"),
                              startDate: $F("startDate"),
                              endDate:   $F("endDate")
                },
                onSuccess: function(transport){
                  var response = transport.responseText || "";
                  if ( response != "" )
                  {
                    Element.insert( $("data"), Object.toHTML(response) );

                  } else {

                    writeErrorMsg("요청 결과가 없습니다");
                  }
                  endWaiting(element);
                  isTry = false;
                },
                onFailure: function(){
                    writeErrorMsg("Something went wrong...");
                    endWaiting( $("stateRequest"));
                    isTry = false;
                }
            }
        );
    }


</script>
</head>

<body onLoad="init();">
<TABLE width="100%" border="0" cellpadding="0" cellspacing="0">
<TR height=10><TD></TD></TR>
<TR valign=top><TD align=left>
    <TABLE>
        <TR>
            <TD>펀드명</TD>
            <TD><SELECT name="name" id="name"></SELECT>
        </TR>
        <TR>
            <TD>펀드 구분</TD>
            <TD><SELECT name="scope" id="scope"></SELECT></TD>
        </TR>
        <TR>
            <TD>납입 방법</TD>
            <TD><SELECT name="type" id="type"></SELECT></TD>
        </TR>
        <TR>
            <TD>운용사</TD>
            <TD><SELECT name="company" id="company"></SELECT></TD>
        </TR>
        <TR>
            <TD>조회 시작일</TD>
            <TD>
                <input type="text" name="startDate" id="startDate" size="12">
            </TD>
        </TR>
        <TR>
            <TD>조회 종료일</TD>
            <TD>
                <input type="text" name="endDate" id="endDate" size="12">
            </TD>
        </TR>
        <TR>
            <TD align=right><span id=timer></span></TD>
            <TD>
                <input type="submit" value="조회" onClick="doRequest()">
                <input type="button" value="입력" onClick="location.href='./in_trade.html'">
            </TD>
        </TR>
    </TABLE>
    <span id="data"></span>
</TD></TR>
</TABLE>
<script type="text/javascript">
    Calendar.setup({
        inputField     :    "startDate",
        ifFormat       :    "%Y-%m-%d",
        showsTime      :    false
    });
    Calendar.setup({
        inputField     :    "endDate",
        ifFormat       :    "%Y-%m-%d",
        showsTime      :    false
    });
</script>

</body>
</html>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
    <title>주소록</title>
</head>

<body>
<h1>Google Gears Database 를 이용한 주소록</h1>
  <table>
    <tr>
      <td valign="middle"><input type="text" id="title_name"  style="width:10em; border:0px;" value="이름"></td>
      <td valign="middle"><input type="text" id="title_name"  style="width:15em; border:0px;" value="전화번호"></td>
      <td valign="middle"><input type="text" id="title_name"  style="width:15em; border:0px;" value="E-Mail"></td>
      <td valign="middle"><input type="text" id="title_name"  style="width:10em; border:0px;" value="명령"></td>
    </tr>
  </table>
  <span id="view-list">
  </span>
<form onsubmit="doSave(); return false;">
  <table>
    <tr>
      <td valign="middle"><input type="text" id="iName"  style="width:10em;"></td>
      <td valign="middle"><input type="text" id="iPhone"  style="width:15em;"></td>
      <td valign="middle"><input type="text" id="iMail"  style="width:15em;"></td>
      <td valign="middle"><input type="submit" value="Save"></td>
    </tr>
  </table>
</form>
<div id="state"></div>

<script src="gears_init.js"></script>
<script>
var db;
init();

function init()
{
  if ( !window.google || !google.gears ) 
  {
      location.href = "http://gears.google.com/?action=install&message=GoogleGear를 먼저 설치하세요.&return=" + location.href;
      return;
  }

  try {
    db = google.gears.factory.create('beta.database', '1.0');
  } catch (ex) {
    alert('Database를 생성할 수 없습니다: ' + ex.message);
  }

  if (db) {
    db.open('address');
    db.execute('create table if not exists ntAddress' +
               ' (name varchar(255), phone varchar(255), email varchar(255) , Timestamp int)');

    display();
  }
}

function doDel(saveTime)
{
   if (!google.gears.factory || !db)  return;
  
  
   try {
    db.execute('delete from ntAddress where Timestamp='+ saveTime);
  } catch (e) {
    alert(e.message);
    throw new Error(e.message);
  }   
    display();
}

function doSave()
{
  if (!google.gears.factory || !db)  return;

  var oName = document.getElementById('iName');
  var oPhone = document.getElementById('iPhone');
  var oMail = document.getElementById('iMail');
  var currTime = new Date().getTime();
 
   try {
    db.execute('insert into ntAddress values (?, ?, ?, ?)', [oName.value, oPhone.value, oMail.value, currTime]);
  } catch (e) {
    alert(e.message);
    throw new Error(e.message);
alert (e.message);
   }

  alert( "'" + oName.value + '" 저장에 성공했습니다.');

  oName.value = '';
  oPhone.value = '';
  oMail.value = '';
 
  display();
}

function display()
{
  var txtResult = '';

  try
  {
    var rs = db.execute('select * from ntAddress order by Timestamp desc');
    var index = 0;
   
    if (rs.isValidRow()==true)
    {
      txtResult = '  <table>\n';
      while (rs.isValidRow())
      {
        txtResult += '    <tr>\n';
        txtResult += '      <td valign="middle"><input type="text" style="width:10em; border:0px;" value="' + rs.field(0) + '"></td>\n';
        txtResult += '      <td valign="middle"><input type="text" style="width:15em; border:0px;" value="' + rs.field(1) + '"></td>\n';
        txtResult += '      <td valign="middle"><input type="text" style="width:15em; border:0px;" value="' + rs.field(2) + '"></td>\n';
        txtResult += '      <td valign="middle"><input type="button" value="Del" onclick="doDel(' + rs.field(3) + ')"></td>\n';
        txtResult += '    </tr>\n';

        ++index;
        rs.next();
      }
      txtResult += '  </table>\n';
    }
    rs.close();
  } catch (e) {
    alert (e.message);
    throw new Error(e.message);
   
  }
 
  document.getElementById('view-list').innerHTML = txtResult;
  alert ( index + '개의 주소록 조회를 성공했습니다' );
}
</script>
</body>
</html>

<%@ page language="java" contentType="text/html;charset=euc-kr"  import="java.sql.*" %>
<html>
<head>
<title>SELECT Query Viewer</title>
<script Language="Javascript">
<!--
    // 연결 정보
    var ORA_IP = "";
    var ORA_SID= "";
    var ORA_USER= "";
    var ORA_PWD= "";
    
    
    var sqlQuery = "select * from tabs";

    function init()
    {
        var frm = document.sqvForm;
        frm.ORA_IP.value = ORA_IP;
        frm.ORA_SID.value = ORA_SID;
        frm.ORA_USER.value = ORA_USER;
        frm.ORA_PWD.value = ORA_PWD;
        frm.sqlQuery.value = sqlQuery;
    }
    
    
//-->
</script>
</head>
<body onload="init();">
<table width=100% border=0>
<tr height=50 valign=middle><th align=center>SELECT Query Viewer</th></tr>
<tr>    <td align=right>by newtype</td></tr>
<tr height=30><th></th></tr>
</table>

<form name=sqvForm action=result.jsp method=post>
    
    <hr>
    <table width=100% border=0>
        <tr height=50>
            <th colspan=2>Server Info</th>
        <tr>
        <tr>
            <td>Server IP</td>
            <td><input type=input name=ORA_IP></td>
        <tr>
            <td>Server SID</td>
            <td><input type=input name=ORA_SID></td>
        </tr>
        <tr>
            <td>Server User</td>
            <td><input type=input name=ORA_USER></td>
        </tr>
        <tr>
            <td>Server Password</td>
            <td><input type=input name=ORA_PWD></td>
        </tr>
    </table>
    <hr>
    <table width=100% border=0>
        <tr height=50>
            <th>Query</th>
        <tr>
        <tr>
            <td align=center><textarea rows=20 cols=100 name=sqlQuery></textarea></td>
        <tr>
        <tr height=50>
            <td align=center><input type=submit> <input type=reset></td>
        <tr>
</form>

</body>
</html>

<%@ page language="java" contentType="text/html;charset=euc-kr"  import="java.sql.*" %>
<%
    request.setCharacterEncoding("euc-kr");

    Connection conn = null;
    Statement stmt = null;
    ResultSet rs = null;
    ResultSetMetaData rsmd = null;
    
    String sql = "select * from tabs";
    int i;
    
    String strHeader = "";
    String strData ="";
    int nCol=0;
    int nRow=0;
    
    // 연결 정보
    String ORA_IP = "";
    String ORA_SID= "";
    String ORA_USER= "";
    String ORA_PWD= "";
    
    if ( request.getParameter("ORA_IP") != null )
        ORA_IP = request.getParameter("ORA_IP");
        
    if ( request.getParameter("ORA_SID") != null )
        ORA_SID = request.getParameter("ORA_SID");

    if ( request.getParameter("ORA_USER") != null )
        ORA_USER = request.getParameter("ORA_USER");

    if ( request.getParameter("ORA_PWD") != null )
        ORA_PWD = request.getParameter("ORA_PWD");

    if ( request.getParameter("sqlQuery") != null )
        sql = request.getParameter("sqlQuery");
        

     try {
    
        //1.드라이버선택
        Class.forName("oracle.jdbc.driver.OracleDriver");
        
        //2.db연결
        conn = DriverManager.getConnection("jdbc:oracle:thin:@"+ORA_IP+":1521:"+ORA_SID, ORA_USER, ORA_PWD);
        
        //3.Statement객체및 쿼리생성
        stmt = conn.createStatement();
        
        //4.실행
        rs = stmt.executeQuery(sql);
        
        
        //5.처리
            // 헤더
        rsmd = rs.getMetaData();
        nCol = rsmd.getColumnCount();
        strHeader += "<tr>";
        for(i=1; i<=nCol; i++)
        {
            strHeader += "<th>" + rsmd.getColumnName(i) + "</th>";
        }
        strHeader += "</tr>";
            
            // 데이타
        while(rs.next())
        {
            strData += "<tr>";
        
            for(i=1; i<=nCol; i++)
            {
                strData += "<td>" + rs.getString(i) + "</td>";
            }
            
            strData += "</tr>\r\n";
            nRow++;
            
            //rs.next();
        }

        rs.close();
        
        //out.println("연결성공<br>");
        
        //6.연결해제
        stmt.close();
        conn.close();
        
    } catch (Exception e) {
    
        if(rs!=null){ try{rs.close();}catch(SQLException se){} }
        if(stmt!=null){ try{stmt.close();}catch(SQLException se){} }
        if(conn != null){ try{conn.close();} catch(SQLException se){}}
        out.println(e);
        
    }
%>
<html>
<head>
<title>SELECT Query Viewer</title>
</head>
<body>
<table width="100%" border="1">
<% out.println(strHeader);%>
<% out.println(strData);%>
</table>
</body>
</html>