반응형
<!-- Script -->
<script layout:fragment="script" th:inline="javascript" type="text/javascript">
//아이디 중복체크 여부
let idCheckYn = false;
$(document).ready(function () {
//회원가입 처리
$("#regUserBtn").on("click", function () {
if (validation()) {
const params = {
userId: $("#userId").val(),
userPassword: $("#userPassword").val(),
userName: $("#userName").val(),
userEmail: $("#userEmail").val()
};
$.ajax({
type : "post",
url : "/user/api/reg",
dataType: "json",
data : JSON.stringify(params),
contentType: 'application/json; charset=utf-8',
success: function (data){
console.log(data);
if(data.code === "1") {
alert("회원가입에 성공했습니다.");
location.href = "/user/login";
} else {
alert("회원가입에 실패했습니다.");
$("#registerFrm")[0].reset();
return false;
}
},
error:function(e){
console.log(e);
alert("회원가입에 실패했습니다.");
return false;
}
});
}
});
//아이디 중복체크
$("#idCheck").on("click", function () {
if ($("#userId").val() === "" || $("#userId").val() === undefined || $("#userId").val() === " ") {
alert("아이디는 필수값입니다.");
$("#userId").focus();
return false;
}
$.ajax({
type : "post",
url : "/user/api/checkDuplicateId/" + $("#userId").val(),
success: function (data){
console.log(data);
if(data.code === "3") {
alert("중복되는 아이디입니다.");
$("#userId").val("").focus();
return false;
} else {
alert("가입 가능한 아이디입니다.");
$("#userName").focus();
idCheckYn = true;
}
},
error:function(e){
console.log(e);
alert("시스템 에러입니다.");
return false;
}
});
});
});
//유효성 검증
function validation() {
//유효성 검증 통과여부
let validationPassYn = false;
if ($("#userId").val() === "" || $("#userId").val() === undefined || $("#userId").val() === " ") {
alert("아이디를 입력해주세요.");
$("#userId").focus();
return false;
}
//아이디 체크 완료
if (!idCheckYn) {
alert("아이디 중복체크를 해주세요.");
return false;
}
if ($("#userName").val() === "" || $("#userName").val() === undefined || $("#userName").val() === " ") {
alert("이름을 입력해주세요.");
$("#userName").focus();
return false;
}
if ($("#userEmail").val() === "" || $("#userEmail").val() === undefined || $("#userEmail").val() === " ") {
alert("이메일을 입력해주세요.");
$("#userEmail").focus();
return false;
}
if ($("#userPassword").val() === "" || $("#userPassword").val() === undefined || $("#userPassword").val() === " ") {
alert("비밀번호를 입력해주세요.");
$("#userPassword").focus();
return false;
}
if ($("#userPasswordConfirm").val() === "" || $("#userPasswordConfirm").val() === undefined || $("#userPasswordConfirm").val() === " ") {
alert("비밀번호 확인을 입력해주세요.");
$("#userPasswordConfirm").focus();
return false;
}
//비밀번호 일치여부
let passwordPassYn = false;
passwordPassYn = ($("#userPassword").val() === $("#userPasswordConfirm").val()) ? true : false;
if (!passwordPassYn) {
alert("비밀번호가 일치하지 않습니다.");
$("#userPassword").val("").focus();
return false;
}
return validationPassYn = true;
}
</script>
반응형
'IT > development' 카테고리의 다른 글
[dbeaver] dbeaver DDL, DML 생성 (0) | 2023.07.08 |
---|---|
[JavaScript] 동적 엘리먼트 onclick 문자열 (0) | 2023.07.05 |
[mybatis] update 동적 쿼리(feat. <set></set>) (0) | 2023.06.24 |
[IDE] IntelliJ 탭 좌/우 이동(feat. Tab Shifter) (0) | 2023.06.22 |
[thymeleaf] js에서 thymeleaf값 사용하기 (0) | 2023.06.21 |