empTest.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript" src="httpRequest.js">
</script>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Insert title here</title>
<script type="text/javascript">
function changeTable(){
var str;
var ss = document.getElementById("ss");
if(ss.selectedIndex != 0){ // selec의 선택된 항목이 [직종선택]이 아닐때만 동작!
str = ss.value;
}else
return;
var param = "job="+escape(encodeURIComponent(str));
sendProcess("empTest.jsp", param, viewTable, "POST");
}
function viewTable(){ // 서버로 부터 결과가 도착하는 곳!!
if(xhr.readyState == 4)
if(xhr.status == 200){
var t = document.getElementById("txt");
t.innerHTML = xhr.responseText;
// txt.innerHTML = xhr.responseText;
}
}
</script>
</head>
<body>
<select id="ss" onchange="changeTable()">
<option selected>직종 선택</option>
<option value="SALESMAN">Sales Man</option>
<option value="MANAGER">Manager</option>
<option value="ANALYST">Analyst</option>
</select>
<table width="600" cellpadding="0" cellspacing="0">
<tr>
<td width="100%">
<table border="1" style="border-collapse:collapse" cellspacing="0" bordercolor="black" width="100%">
<tr align="center" bgcolor="#dedede">
<td width="10%">사번</td>
<td width="15%">이름</td>
<td width="20%">직종</td>
<td width="15%">급여</td>
<td width="20%">입사일</td>
<td width="20%">부서번호</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<p id="txt"></p>
</td>
</tr>
</table>
</body>
</html>
empTest.jsp
<%@page import="java.sql.ResultSet"%>
<%@page import="java.sql.PreparedStatement"%>
<%@page import="javax.naming.Context"%>
<%@page import="java.sql.Connection"%>
<%@page import="javax.naming.InitialContext"%>
<%@page import="javax.sql.DataSource"%>
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<%
// DataSource 등록여부 확인 후, application에 속성 작업
DataSource ds = (DataSource)application.getAttribute("ds");
if(ds == null){
try{
InitialContext ic = new InitialContext();
Context ctx = (Context)ic.lookup("java:comp/env");
ds = (DataSource)ctx.lookup("jdbc/oracle");
application.setAttribute("ds", ds);// application에 속성 설정
}catch(Exception e){
e.printStackTrace();
}
}
%>
<%!
Connection con=null;
PreparedStatement pstmt;
ResultSet rs;
String sql = "select empno, ename, job, sal, hiredate, deptno from emp where job=?";
%>
<%@page import="java.net.URLDecoder"%>
<table border="1" style="border-collapse:collapse" cellspacing="0" bordercolor="black" width="100%">
<%
// 파라메터 값 받기
String job = URLDecoder.decode(request.getParameter("job"), "UTF-8");
try{
// DB 작업
con = ds.getConnection();
pstmt = con.prepareStatement(sql);
pstmt.setString(1, job);
rs = pstmt.executeQuery();
while(rs.next()){
// DB에서 검색된 결과가 있는 경우
%>
<tr align="center">
<td width="10%"><%=rs.getString("empno") %></td>
<td width="15%"><%=rs.getString("ename") %></td>
<td width="20%"><%=rs.getString(3) %></td>
<td width="15%"><%=rs.getString(4) %></td>
<td width="20%"><%=rs.getString(5) %></td>
<td width="20%"><%=rs.getString("deptno") %></td>
</tr>
<%
} // end while
}catch(Exception e){
e.printStackTrace();
}finally{
try{
if(rs != null) rs.close();
if(pstmt != null) pstmt.close();
if(con != null) con.close();
}catch(Exception e){
e.printStackTrace();
}
}
%>
</table>
'Programing > Ajax' 카테고리의 다른 글
| AJAX - Open API 기능 사용 책검색 / 지도 찾기 (0) | 2008.07.29 |
|---|---|
| Ajax - suggest (0) | 2008.07.29 |
| Ajax - innerHTML (0) | 2008.07.29 |
| Ajax - innerHTML (0) | 2008.07.29 |
| Ajax - 비동기식? (0) | 2008.07.29 |
