...더보기
# Read Before
아이디 중복을 확인하는 AJAX 코드입니다. 이 포스팅에서는 html 코드와 요청을 처리해주는 jsp 코드, DAO class를 포함합니다.
# 아이디 중복 확인
- html Code
- html에서 script 태그를 통해 AJAX를 이용
- $ 표시는 jquery를 뜻함.
- Ajax에 대해 더 알아 보기 --> 2019/07/26 - [Employment Academy] - [ JS ] Day 13 - ② Ajax
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="./js/jquery.js"></script>
<script type="text/javascript">
$(function() {
$('#chk').click(function() {
var id = $('#id').val();
var sendData = "id=" + id
$.post('confirmId.jsp', sendData, function(msg) {
$('#msg').html(msg);
});
});
});
</script>
</head>
<body>
<form action="">
아이디 : <input type="text" name="id" id="id"> <input
type="button" value="중복체크" id="chk"> <span id="msg"
style="color: red"></span>
<p>
암호 : <input type="password" name="pass" id="pass">
<p>
이름 : <input type="text" name="name" id="name">
<p>
<input type="submit" value="확인">
</form>
</body>
</html>
- confirmId.jsp
- MemberDAO의 confirm(String id) 메소드를 통해 회원 목록에 있는 지 확인
<%@page import="ajax.MemberDAO"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!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>Insert title here</title>
</head>
<body>
<%
String id = request.getParameter("id");
MemberDAO md = MemberDAO.getInstance();
int result = md.confirm(id);
if(result ==0){
out.println("사용할 수 있는 아이디 입니다.");
}else{
out.println("이미 있는 아이디 입니다. 다른 것을 사용해주십시오.");
}
%>
</body>
</html>
- memberDAO
package ajax;
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import javax.naming.Context;
import javax.naming.InitialContext;
import javax.sql.DataSource;
public class MemberDAO {
private static MemberDAO instance;
public MemberDAO() {}
public static MemberDAO getInstance() {
if(instance == null) {
instance = new MemberDAO();
}
return instance;
}
private Connection getConnection() {
Connection conn = null;
try {
Context ctx = new InitialContext();
DataSource ds = (DataSource) ctx.lookup("java:comp/env/jdbc/OracleDB");
conn = ds.getConnection();
}catch(SQLException e) {
System.err.println(" * Error 이유 : Database 구문 오류, "+e.getMessage());
}catch (Exception e) {
System.err.println(" * Error 이유 : "+e.getMessage());
}
return conn;
}
public int confirm(String id) throws SQLException {
Connection conn = null;
PreparedStatement psmt = null;
int result = 0;
try {
conn = getConnection();
psmt = conn.prepareStatement("SELECT * FROM member1 where id = ?");
psmt.setString(1, id);
ResultSet rs = psmt.executeQuery();
if(rs.next() == true) result=1;
else result = 0;
}catch(SQLException e) {
System.err.println(" * Error 이유 : Database 구문 오류, "+e.getMessage());
}catch(Exception e) {
System.err.println(" * Error 이유 : "+e.getMessage());
}finally {
if(psmt != null) psmt.close();
if(conn != null) conn.close();
}
return result;
}
}
- context.xml
<Context>
<Resource
name="jdbc/OracleDB"
auth="Container"
type="javax.sql.DataSource"
username="scott"
password="tiger"
driverClassName="oracle.jdbc.driver.OracleDriver"
factory="org.apache.tomcat.dbcp.dbcp2.BasicDataSourceFactory"
url="jdbc:oracle:thin:@127.0.0.1:1521:xe"
maxActive="100"
maxIdle="10"/>
<Resource
name="jdbc/MySql"
auth="Container"
type="javax.sql.DataSource"
username="root"
password="mysql"
driverClassName="com.mysql.jdbc.Driver"
factory="org.apache.tomcat.dbcp.dbcp2.BasicDataSourceFactory"
url="jdbc:mysql://localhost:3306/test"
maxActive="100"
maxIdle="10"/>
</Context>'청년취업아카데미 > DayLog' 카테고리의 다른 글
| [ JSP ] Day 14 - ② MVC 2 패턴으로 개발하기 (0) | 2019.07.29 |
|---|---|
| [ JSP ] Day 14 - ① MVC (0) | 2019.07.29 |
| [ JS ] Day 13 - ② Ajax (0) | 2019.07.26 |
| [ JS ] Day 13 - ① 브라우저 객체 (0) | 2019.07.26 |
| [ JS ] Day 12 - ② JavaScript 객체 (0) | 2019.07.25 |
