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

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

· 1년 전 · 1643 · 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개월 전
감사합니다~ ^^

게시글 목록

번호 제목
20849
20820
20819
20811
20798
20791
20786
20782
20768
20747
20720
20715
20705
20659
20654
20648
20640
20620
20608
20600
20599
20597
20580
20574
20562
20549
20542
20535
20512
20503