등록 페이지에서 이용 가능 버튼을 만들고 싶습니다.

Question

많은 웹 사이트에 "이용 가능 여부 확인"버튼이 있습니다. 그리고 이걸 갖고 싶습니다. 그러나 이것은 Ajax와 Jquery를 사용할 때만 사용 가능한 것으로 보인다. PHP와 Javascript 만 사용하여이 작업을 수행 할 수있는 방법이 있습니까? 나는 Ajax 또는 Jquery로 작업 할 기술이없는 시작 프로그래머이기 때문입니다.

내가 원하는 것은 사용자 이름 필드입니다. 나는 사용자 이름을 입력하고, 이름을 사용할 수 있는지 확인하려고합니다. 해당 사용자가 사용 가능 여부 확인 버튼을 클릭하면 "이 사용자 이름을 사용할 수 있습니다"또는 "이 사용자 이름이 이미 사용되었습니다"라는 팝업이 표시됩니다.

PHP 및 Javscript에서이 작업을 수행하는 방법을 알고 있다면 매우 알고 있어야합니다.

Answer 1

jQuery ajax를 사용하면 가장 간단합니다. & 쉬운 방법입니다.

Ajax를 사용하면 사용자 이름을 매개 변수로 사용하는 PHP 페이지에 요청을 보내거나 (get 또는 post 메소드를 사용하여 아약스 호출에서 지정할 수 있음) 데이터베이스 &에 적절한 고유 응답을 반환하는 서버 측 검색을 수행하십시오.

Answer 2

PHP와 Javascript 만 사용하여 어떤 방식 으로든이 작업을 수행 할 수 있습니까? 저는 시작 프로그래머이기 때문에 Ajax 또는 Jquery와 함께 작업 할 기술이 없습니다.

jQuery에서 AJAX 요청을 작성하는 것이 순수한 자바 스크립트로 작성하는 것보다 훨씬 간단하다고 생각합니다.

jQuery는 자바 스크립트의 확장이므로 최소한의 jQuery를 사용하여 서버에 요청한 다음 순수한 자바 스크립트를 사용하여 응답을 처리 할 수 ​​있습니다. jQuery를 AJAX를 사용에

봐 : 나는이 작업을 위해 jQuery를 사용하는 것이 좋습니다

success: function(data){ 
     if (data == 1){ 
      $(".message").html("Available"); 
     } 
     else { 
      $(".message").html("Already Taken"); 
     } 
     } 

Answer 3

:

여기

http://api.jquery.com/jQuery.ajax/

$.ajax({ 
    url: "test.html", 
    context: document.body, 
    success: function(){ 
    $(this).addClass("done"); 
    } 
}); 

당신은 같은에 success 부분을 변경합니다.

jQuery (또는 다른 Javascript 라이브러리)는 작업 중 하나를 사용하지 않고 수행하는 것보다 완료하기가 쉽습니다.

jQuery docs은 좋아요. 당신이 원하는 것과 일치하는 online tutorials이 많이 있습니다.

jQuery 라이브러리에 대해 익숙해지면 도움이됩니다.

Answer 4

아약스 (및 jquery)를 사용하는 것이 더 쉬울 것 같습니다. 당신이 jQuery를 포함 할 필요가 물론

$.ajax({ 
    url: 'usernameChecker.php', 
    dataType: 'GET', 
    data: 'username=' + $("#yourUserNameFieldID").val(), 
    success: function(result) 
    { 
     alert(result); 
    } 
}); 

이를 구현하기 : 클라이언트 측에이 같은 요청을해야합니다. jQuery를 사용하면 쉽게 ajax 호출을 할 수 있습니다.당신의 서버 측에

이 같은 것을 사용할 수 있습니다

<?php 
if(isset($_GET["username"])) 
{ 
    // check username 
    if(username_is_free) 
    // of course this needs to be a bit different, but you'll get the idea 
    { 
     echo "Username is free!"; 
    } 
    else echo "Username is taken!"; 
} 
?> 

Answer 5

$(document).ready(function(){ 
    // available-button is the ID of the check availability button 
    //checkAvailability.php is the file which gets the username param and checks if its available 
    // user is the id of the input text field where the user enter the username 
    // available-message is the id of a div which displays the availability message. Use this instead of alert 
    $('#available-button').click(function() { 
     $.ajax({ 
      type : 'POST', 
      url : 'checkAvailability.php', 
      data: { 
       username : $('#user').val() 
      }, 
      success : function(data){ 
       $('#available-message').text(data); 
      }, 
      error : function(XMLHttpRequest, textStatus, errorThrown) { 
       alert("Some Error occured. Try again") 
      } 
     }); 
     return false; 
    }); 
});