<input type="text" name="id" id="idInput"></label>
<div id="duplicateMessage" style="color: red;"></div> <!-- 메시지를 출력할 요소 추가 -->
<!-- 아이디 중복검사 -->
<script>
$(document).ready(function () {
$("#idInput").on("focusout", function () {
const enteredId = $(this).val();
$.ajax({
type: "POST",
url: "DuplicateCon",
data: { id: enteredId },
dataType: "json",
success: function (response) {
const duplicateMessage = $("#duplicateMessage");
const signUpBtn = $("#signUpBtn"); // 회원가입 버튼 선택
if (response.status === "duplicate") {
duplicateMessage.text("중복된 아이디입니다.");
signUpBtn.prop("disabled", true);
signUpBtn.addClass("signUpButton"); // 회원가입 버튼 클래스 추가 (비활성화 스타일 적용)
} else {
duplicateMessage.text("");
signUpBtn.prop("disabled", false);
signUpBtn.removeClass("signUpButton"); // 회원가입 버튼 클래스 제거 (활성화 상태에서 기본 스타일 적용)
}
},
error: function (xhr, status, error) {
console.error("AJAX 요청 중 오류가 발생했습니다:", error);
}
});
});
});
</script>
DuplicateCon
package controller;
import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.json.JSONObject;
import model.UserDAO;
import model.UserDTO;
@WebServlet("/DuplicateCon")
public class DuplicateCon extends HttpServlet {
protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
response.setContentType("application/json"); // JSON 형식으로 응답을 설정
UserDAO udao = new UserDAO();
String user_id = request.getParameter("id");
int row = udao.duplicateId(user_id);
JSONObject jsonResponse = new JSONObject(); // 응답용 JSON 객체 생성
if (row > 0) {
jsonResponse.put("status", "duplicate"); // 중복된 아이디일 경우 status에 "duplicate" 추가
} else {
jsonResponse.put("status", "not_duplicate"); // 중복되지 않은 아이디일 경우 status에 "not_duplicate" 추가
}
response.getWriter().write(jsonResponse.toString()); // JSON 응답 전송
}
}
DAO, Mapper
public int duplicateId(String user_id) {
SqlSession session = sqlSessionFactory.openSession(true);
int row = session.selectOne("duplicateId", user_id);
session.close();
return row;
}
<select id="duplicateId" parameterType="String" resultType="int">
select count(user_id) from user_info where user_id=#{user_id}
</select>
'프로젝트 코드리뷰 > Travel Maker' 카테고리의 다른 글
Travel Maker - 반응형 웹 (미완성) (0) | 2023.08.25 |
---|---|
Travel Maker - 평점시스템 (0) | 2023.08.25 |
Travel Maker - SummerNote (0) | 2023.08.25 |
Travel Maker - Google Maps (0) | 2023.08.25 |
Travel Maker - 결제API (PortOne) (0) | 2023.08.25 |