jsp 아이디 중복검사 유효성 검사(현재 jsp파일에서 alert 띄우기)

티스토리 뷰

etc

jsp 아이디 중복검사 유효성 검사(현재 jsp파일에서 alert 띄우기)

댕댕이발🐾 2018. 5. 9. 23:09

학교 과제 중에 나를 너무 괴롭혔던 부분이다.

일단 내가 하려는 과정은

<%@page import="java.util.ArrayList"%>

<%@page import="com.test.simple.JdbcHandler"%>

<%@ page language="java" contentType="text/html; charset=UTF-8" import="java.sql.*"

pageEncoding="UTF-8"%>

<%@page import="com.test.simple.Validation"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<% request.setCharacterEncoding("utf-8"); %>

<html>

<head>

<style>

table {

font-family: arial, sans-serif;

border-collapse: collapse;

width: 100%;

}

td, th {

border: 1px solid #2E9AFE;

padding: 8px;

}

</style>

<title>Insert title here</title>

</head>

<body>

<table>

<tr>

<input type="button" value="중복확인" onclick="return validation()"> 중복확인 절차를 거쳐야 합니다.

</th>

</tr>

<tr>

<input type="password" name="password"> 다시 한번

<input type="password" name="pwdCheck"> (영문+숫자 4~12자리)

</th>

</tr>

<tr>

</th>

</tr>

<tr>

<th align="right"><span style="color:red">★</span>Email</th>

</th>

</tr>

<tr>

</th>

</tr>

<tr>

</th>

</tr>

<tr>

<input type="text" name="addr4"> 나머지 주소를 적어 넣습니다.

</th>

</tr>

<tr>

</select>

</th>

</tr>

</table>

</center>

</form>

JdbcHandler handler = new JdbcHandler();

handler.getConnection();

ArrayList<String> li = new ArrayList<>();

li = handler.getData();

StringBuffer values = new StringBuffer();

for(int i=0; i<li.size(); i++) {

if(values.length()>0) {

values.append(',');

}

values.append('"').append(li.get(i)).append('"');

}

function validation() {

var id = document.getElementById("id").value;

var flag = true;

var list = [ <%=values.toString()%>];

//아이디 입력 여부

if(id=="") {

alert("아이디를 입력해주세요.");

return ;

}

for(var i=0; i<list.length; i++) {

if(id==list[i]){

flag = false;

break;

}

if(flag)

alert("사용 가능한 아이디 입니다.");

else

alert("중복된 아이디 입니다.");

}

</script>

</body>

</html>

완벽하게 짜놓은 코드는 아닌데 제일 애 먹었던 부분이 아이디 중복 검사를 하는 부분이었다. 등록버튼을 눌렀을 때 form 태그 안에 있는 정보들이 JDBC로 연결된 DB에 저장되는 형태이다.

저장되어있는 DB를 토대로 아이디 중복검사를 해야하는데 input value의 값은 jsp의 코드에서는 post 과정이 끝나지 않는 이상 값을 가져올 수가 없다. (등록 버튼을 누르기 전까지는 jsp 코드로는 input value의 값을 가져올 수가 없다.)

그런데 중복검사는 페이지가 넘어가기 전에 이루어져야하는 과정이다. 해당 페이지안에서 중복검사 로직을 돌려야하는 것이다.

JdbcHandler handler = new JdbcHandler();

handler.getConnection();

ArrayList<String> li = new ArrayList<>();

li = handler.getData();

이 소스는 DB에 저장된 id값을 ArrayList 형태로 가져오는 컨트롤러이다. ( jsp 페이지만 보여주다보니 컨트롤러인 java 코드는 생략)

맘같아서는 for문을 돌려서 input value랑 ArrayList 랑 비교해버리고 싶은데 jsp에서 작성된 자바코드에서 input value 값을 받을 수가 없다. 그래서 이 값을 자바스크립트한테 넘겨줘야 한다. 그리고 이 배열을 자바스크립트 배열에 그대로 복사해주기 위해 사전작업이 필요하다. (참고로 jsp 변수를 javascript로 넘길 순 있지만 그 반대로는 불가능하다.)

StringBuffer values = new StringBuffer();

for(int i=0; i<li.size(); i++) {

if(values.length()>0) {

values.append(',');

}

values.append('"').append(li.get(i)).append('"');

}

구글링하다가 겨우겨우 찾은 구문인데 그대로 쓰니 잘 작동되는 것 같다. 아마 배열 자료형이 ArrayList 일 때만 가능한 것 같다.

자바의 ArrayList를 자바스크립트의 배열에 그대로 복사를 할 수 없기 때문에 형변환? 같이 생각하면 될 것같다.

function validation() {

var id = document.getElementById("id").value;

var flag = true;

var list = [ <%=values.toString()%>];

//아이디 입력 여부

if(id=="") {

alert("아이디를 입력해주세요.");

return ;

}

for(var i=0; i<list.length; i++) {

if(id==list[i]){

flag = false;

break;

}

if(flag)

alert("사용 가능한 아이디 입니다.");

else

alert("중복된 아이디 입니다.");

}

</script>

document.getElementById 를 이용하면 post 되기 전의 input value의 값도 알 수가 있다.

그리고 java 변수를 js 변수로 대입하기 위해선 <%= %> 의 형태로 java 변수를 감싸고 있으면 된다.

그러면 현재 input text에 작성된 값과 list 변수의 값을 반복문을 통해 비교해서 동일한 값이 있는지만 체크하면 된다.

수업이 jsp 수업이라서 자바스크립트나 ajax 이런건 수업내용에 없기도해서 최대한 java랑 jsp 코드로만 하려고했는데

유효성검사는 대부분 자바스크립트로 많이들 짜는 것같다..

저작자표시

'etc' 카테고리의 다른 글

스토리보드 제작 툴 power mockup 무료 라이센스 취득하기 (0)	2018.03.28
어플리케이션 이미지(icon, button...) (0)	2018.03.21
어플리케이션 해상도 값, 기타 고정값들 (0)	2018.03.21
각종 기사, 산업기사.. 필기 기출문제 CBT (0)	2018.03.21

공지사항

최근에 올라온 글

최근에 달린 댓글

Total

Today

Yesterday

링크

TAG more

« 2025/01 »
일	월	화	수	목	금	토
			1	2	3	4
5	6	7	8	9	10	11
12	13	14	15	16	17	18
19	20	21	22	23	24	25
26	27	28	29	30	31

글 보관함

T3ch

티스토리 뷰

jsp 아이디 중복검사 유효성 검사(현재 jsp파일에서 alert 띄우기)

'etc' 카테고리의 다른 글

티스토리툴바