테스트 사이트 - 개발 중인 베타 버전입니다

회원가입 및 회원 수정 시 중복 확인 해보기

· 1년 전 · 1642 · 9

필요에 의해 찾다가 

 

https://sir.kr/g5_skin/58008

 

웅프님이 공유해주신 코드를 토대로 코드 리팩토링을 진행 하였습니다.

 

 

[code]

<script>
    function checkDuplicate(type) {
        let url;
        let fieldId;
        let msgId;
        let typeName;

        switch (type) {
            case 'id':
                url = "ajax.mb_id.php";
                fieldId = "#reg_mb_id";
                msgId = "#msg_mb_id";
                typeName = "아이디";
                break;
            case 'nick':
                url = "ajax.mb_nick.php";
                fieldId = "#reg_mb_nick";
                msgId = "#msg_mb_nick";
                typeName = "닉네임";
                break;
            case 'email':
                url = "ajax.mb_email.php";
                fieldId = "#reg_mb_email";
                msgId = "#msg_mb_email";
                typeName = "이메일";
                break;
            default:
                return; 
        }

        var fieldValue = $(fieldId).val();
        var data = {};
        data['reg_mb_' + type] = fieldValue;
        if (type !== 'id') { 
            data['checkDuplicate' + type.charAt(0).toUpperCase() + type.slice(1)] = 1;
        }

        $.post(url, data, function(response) {
            response ? $(msgId).html(response) : $(msgId).html('사용할 수 있는 ' + typeName + '입니다.');
        });
    }

</script>

[/code]

 

사용법은 checkDuplicate('id') / checkDuplicate('nick') / checkDuplicate('email') 입니다.

 

이번에 저도 적용하면서 공유합니다.

 

버튼을 토대로 클릭 하시면 되겠습니다.

 

참고로 제가 쓴 예제 잠시 보여드리자면

 

아이디 중복 확인입니다. (tailwind)

 

[code]

<button type="button" class="btn_bo_sch basis-full sm:basis-3/12 focus:outline-none text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-sm px-3 md:px-5 py-2.5 my-5 sm:mb-0 sm:mt-0 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-900" onclick="checkDuplicate('id')">아이디 중복확인</button>

[/code]

 

좋은 자료 공유해주신 @웅프 님께 감사의 말씀 드립니다.

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

댓글 9개

유용한 코드네요. 공유 감사합니다.

오호 감사합니다 ^^

스크랩 추가요 ^^
1년 전

감사 합니다.

1년 전

좋아요 추천합니다.

 감사합니다.

1년 전

감사합니다

유용한 팁 감사합니다.
1개월 전
감사합니다~ ^^

게시글 목록

번호 제목
21529
21526
21521
21516
21513
21502
21485
21471
21467
21457
21424
21421
21415
21410
21406
21405
21394
21378
21354
21349
21345
21316
21299
21297
21279
21276
21254
21242
21214
21206