카테고리 없음

PHP - Ajax 써보기

grovy 2023. 5. 14. 23:55
728x90

PHP에서 Ajax를 써볼게요 

아래는 PHP소스 일부분이에요 

<main>
    <div class="over">
        <label for="youEmail" class="required">이메일</label>
        <input type="email" id="youEmail" name="youEmail" class="inputStyle"  placeholder="이메일을 적어주세요" >
        <a href="#a" class="youCheck btnStyle2" onclick='emailChecking()'>이메일 중복검사</a>
        <p class="msg" id="youEmailComment"></p><!-- 이메일이 존재합니다. -->
    </div>
    <div class="over">
        <label for="youNick" class="required">닉네임</label>
        <input type="text" id="youNick" name="youNick" class="inputStyle"  placeholder="닉네임을 적어주세요" >
        <a href="#a" class="youCheck btnStyle2">닉네임 중복검사</a>
        <p class="msg" id="youNickComment"></p> <!--닉네임이 존재합니다. -->
    </div>
</main>

위에 onclick이벤트에서 jquery를 이용해서 ajax를 써볼거에요 ! 

 

<script src="https://code.jquery.com/jquery-3.6.4.js" integrity="sha256-a9jBBRygX1Bh5lt8GZjXDzyOB+bWve9EiO7tROUtj/E=" crossorigin="anonymous"></script>
<script>
    let isEmailCheck = false;
    function emailChecking(){
        let youEmail = $("#youEmail").val();

        if(youEmail == null || youEmail ==''){
            $("#youEmailComment").text(" * 이메일을 입력해 주세요");
        }else{
            $.ajax({
                type : "POST",
                url : "joinCheck.php",
                data : {"youEmail" : youEmail , "type":isEmailCheck},
                dataType : "json",

                success : function(data){
                    if(data.result == "good"){
                        $("#youEmailComment").text("사용가능한 이메일입니다.");
                        isEmailCheck = true;
                    }else{
                        $("#youEmailComment").text("이미 사용중인 이메일입니다.");
                        isEmailCheck = false;
                    }
                },
                error : function(requst, status, error){
                    console.log("requst : " + requst);
                    console.log("status : " + status);
                    console.log("error : " + error);
                }
            })
        }
    }

</script>

요렇게 $.ajax를 써서 호출을 해주구요 

ajax문법을 써서 joinCheck를 호출했어요 ! 

<?php
    include "../connect/connect.php";

    // Select youEmail from adminMembers where youEmail = {}

    $type = $_POST['type'];
    $jsonResult = "bad";
    
    if($type == "isEmailCheck"){
        $email = $_POST['youEmail'];
        $youEmail = $connect -> real_escape_string(trim($email));
        $sql.= "SELECT adminEmail from adminmembers where adminEmail = '{$youEmail}'";
    }

    $result = $connect -> query($sql);
    
    if($result -> num_rows ==0){
        $jsonResult = "good";
    }
    echo json_encode(array("result" => $jsonResult));
?>

요긴 joinCheck.php입니다

 

내용을 간략히 말하자면 이메일을 조회해서 값이 있다면 bad를 반환 없다면 good을 반환하는 로직이에요 ! 

 

자세한 코드를 보고싶으시면 .. 

 

요기에 !