결과물
테이블 선택시
소스 / /
memberinfo.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>memberInfo.html::김훈</title>
<script type="text/javascript" src="../../js/jquery-1.7.2.js">
</script>
<script type="text/javascript">
$(function(){
$.getJSON("memberData.jsp",
function(data){
// alert(data);
var str = "<table id='mem_list' align='center'border='1' bordercolor='yellow' >";
str += "<tr bgcolor='silver'><th>회원ID</th><th>회원성명</th><th>주민번호</th><th>우편번호</th>";
str +="<th>주 소</th><th>회사전화</th><th>핸드폰</th><th>이메일</th></tr>";
$.each(data, function(i, v){
str += "<tr id='mem_select'>";
str += "<td class='mem_id'>" + v.mem_id + "</td>";
str += "<td>" + v.mem_name + "</td>";
str += "<td>" + v.mem_regno + "</td>";
str += "<td>" + v.mem_zip + "</td>";
str += "<td>" + v.mem_add + "</td>";
str += "<td>" + v.mem_comtel + "</td>";
str += "<td>" + v.mem_hp + "</td>";
str += "<td>" + v.mem_mail + "</td></tr>";
});
str += "</table>";
$("#memList").html(str);
});
$("#mem_select").live("click", function(){
var mem_id = $(this).children(".mem_id").text().trim();
$.getJSON("memberData.jsp",
"mem_id="+mem_id,
function(data){
$.each(data,function(i,v){
$("#mem_id").val(v.mem_id);
$("#mem_pass").val(v.mem_pass);
$("#mem_name").val(v.mem_name);
$("#mem_regno").val(v.mem_regno);
$("#mem_bir").val(v.mem_bir);
$("#mem_zip").val(v.mem_zip);
$("#mem_add").val(v.mem_add);
$("#mem_hometel").val(v.mem_hometel);
$("#mem_comtel").val(v.mem_comtel);
$("#mem_hp").val(v.mem_hp);
$("#mem_mail").val(v.mem_mail);
$("#mem_job").val(v.mem_job);
$("#mem_like").val(v.mem_like);
$("#mem_memorial").val(v.mem_memorial);
$("#mem_memorialday").val(v.mem_memorialday);
$("#mem_mileage").val(v.mem_mileage);
if (v.mem_delete != "y") {
$("#mem_delete").attr("checked", true);
}
});
});
});
});
</script>
</head>
<body>
<center>
<table id="memInfo">
<tr>
<td width="400px" align="left">
<b>I D : </b> <input type="text" size="20" id="mem_id" disabled="false" />
</td>
<td width="30px">
</td>
<td align="left">
<b>암 호 : </b> <input type="text" size="20" id="mem_pass" disabled="false" />
</td>
</tr>
<tr>
<td width="400px" align="left">
<b>성 명 : </b> <input type="text" size="20" id="mem_name" disabled="false" />
</td>
<td>
</td>
<td align="left">
<b>주민번호 : </b>
<input type="text" size="15" id="mem_regno" disabled="false" />
</td>
</tr>
<tr>
<td width="400px" align="left">
<b>생년월일 : </b>
<input type="text" size="20" id="mem_bir" disabled="false" />
</td>
<td>
<td colspan="3" align="left">
<b>우편번호 : </b>
<input type="text" size="7" id="mem_zip" disabled="false" />
</td>
</td>
</tr>
<tr>
<td colspan="3" align="left">
<b>주 소 : </b>
<input type="text" size="53" id="mem_add" disabled="false" />
</td>
</tr>
<tr>
<td align="left">
<b>집 전 화 : </b>
<input type="text" size="20" id="mem_hometel" disabled="false" />
</td>
<td>
</td>
<td align="left">
<b>회사전화 :</b>
<input type="text" size="20" id="mem_comtel" disabled="false"/>
</td>
</tr>
<tr>
<td align="left">
<b>핸 드 폰 :</b>
<input type="text" size="20" id="mem_hp" disabled="false" />
</td>
<td>
</td>
<td align="left">
<b>이 메 일 :</b> <input type="text" size="20" id="mem_mail" disabled="false"/>
</td>
</tr>
<tr>
<td align="left">
<b>직 업 :</b> <input type="text" size="20" id="mem_job" disabled="false" />
</td>
<td>
</td>
<td align="left">
<b>취 미 :</b> <input type="text" size="20" id="mem_like" disabled="false" />
</td>
</tr>
<tr>
<td align="left">
<b>기념일종류 :</b>
<input type="text" size="20" id="mem_memorial" disabled="false" />
</td>
<td>
</td>
<td align="left">
<b>기념일날짜 :</b>
<input type="text" size="20" id="mem_memorialday" disabled="false" />
</td>
</tr>
<tr>
<td align="left">
<b>마일리지 :</b>
<input type="text" size="20" id="mem_mileage" disabled="false"/>
</td>
<td>
</td>
<td align="left">
<b>탈퇴여부 :</b>
<input type="checkbox" size="20" id="mem_delete" disabled="false" />
</td>
</tr>
</table><hr/>
<div id="memList">
</div>
</center>
</body>
</html>
jsonData.jsp
<%@ page language="java" contentType="text/plain; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@page import="java.sql.*"%>
<%@page import="kr.or.ddit.db.ConnectionProvider"%>
<%@page import="java.sql.Connection"%>
<%@ page import = "kr.or.ddit.db.*" %>
<% request.setCharacterEncoding("UTF-8");
String mem_id=request.getParameter("mem_id");
System.out.print(mem_id);
%>
[
<%
Connection conn = null;
PreparedStatement psmt = null;;
ResultSet rs = null;
try{
conn =ConnectionProvider.getConnection();
if(mem_id==null){
psmt = conn.prepareStatement("select * from member");
}else {
psmt = conn.prepareStatement("select * from member where mem_id=?");
psmt.setString(1, mem_id);
}
rs=psmt.executeQuery();
%>
<%
while(rs.next()){
if(rs.getRow()>1){
out.print(",");
}
%>
{
"mem_id" : "<%=Util.toJS(rs.getString("mem_id"))%>",
"mem_pass" : "<%=Util.toJS(rs.getString("mem_pass"))%>",
"mem_name" : "<%=Util.toJS(rs.getString("mem_name"))%>",
"mem_regno" : "<%=Util.toJS(rs.getString("mem_regno1"))%> - <%=Util.toJS(rs.getString("mem_regno2"))%>",
"mem_bir" : "<%=Util.toJS(rs.getString("mem_bir")).subSequence(0, 10)%>",
"mem_zip" : "<%=Util.toJS( rs.getString("mem_zip"))%>",
"mem_add" : "<%=Util.toJS(rs.getString("mem_add1"))%> <%=Util.toJS(rs.getString("mem_add2"))%>",
"mem_hometel" : "<%=Util.toJS(rs.getString("mem_hometel"))%>",
"mem_comtel" : "<%=Util.toJS(rs.getString("mem_comtel"))%>",
"mem_hp" : "<%=Util.toJS(rs.getString("mem_hp"))%>",
"mem_mail" : "<%=Util.toJS(rs.getString("mem_mail"))%>",
"mem_job" : "<%=Util.toJS(rs.getString("mem_job"))%>",
"mem_like" : "<%=Util.toJS(rs.getString("mem_like"))%>",
"mem_memorial" : "<%=Util.toJS(rs.getString("mem_memorial"))%>",
"mem_memorialday" : "<%=Util.toJS(rs.getString("mem_memorialday")).subSequence(0, 10)%>",
"mem_mileage" : "<%=Util.toJS(rs.getString("mem_mileage"))%>",
"mem_delete" : "<%=Util.toJS(rs.getString("mem_delete"))%>"
}
<%
}
}catch(SQLException e){
e.printStackTrace();
}finally{
if(rs!=null) try{rs.close();}catch(Exception e){}
if(psmt!=null) try{psmt.close();}catch(Exception e){}
if(conn!=null) try{conn.close();}catch(Exception e){}
}
%>
]
이 글은 스프링노트에서 작성되었습니다.
'J-Query' 카테고리의 다른 글
| 조작하려는 엘리먼트 선택하기 (0) | 2012.06.07 |
|---|---|
| 버튼이벤트->레이어 새창으로 표현 (0) | 2012.05.08 |
| 9일차 XML문서 (0) | 2012.05.08 |
| 8일차 사용자정의객체&JSON표기법 (0) | 2012.05.08 |
| 7일차 Effects (0) | 2012.05.08 |
