Ajax 양식 유효성 검사

ajax/php를 사용하여 폼 유효성 검사를 만들었습니다. 각 텍스트 상자는 다른 파일을 사용하여 확인됩니다. username_ajax.php. 정보가 확인 된 후에는 화면에 표시됩니다 ("사용자 이름 확인"). 모든 텍스트 상자가 '확인'되면 제출 버튼 만 누르는 방법을 알아낼 수 없습니다. 어떤 도움을 주셔서 감사합니다, 고마워.Ajax 양식 유효성 검사

내 코드 (죄송합니다 긴) : 모든 입력이 확인 될 때까지 비활성화에 제출 '버튼을 설정

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Sign-up</title> 
</head> 
<script type="text/javascript"> 

    function username(username) 
{ 
    var httpRequest; 
    make_request() 
    function stateck() 
     { 
      if(httpxml.readyState==4) 
      { 
      document.getElementById ("user_div").innerHTML=httpxml.responseText; 
      } 
     } 

    httpxml.onreadystatechange=stateck; 
    user_url="ajax_username.php?username=" + username.value; 
    httpxml.open("GET",user_url,true); 
    httpxml.send(null); 
} 


function email(email) 
{ 
    var httpRequest; 
     make_request() 
     function stateck() 
     { 
      if(httpxml.readyState==4) 
      { 
      document.getElementById("email_div").innerHTML=httpxml.responseText; 
      } 
     } 

    httpxml.onreadystatechange=stateck; 
    email_url="ajax_email.php?value=" + email.value; 
    httpxml.open("GET",email_url,true); 
    httpxml.send(null); 
} 

function confirm(password,conpassword) 

{ 
    var httpRequest; 
    make_request() 
    function stateck() 
    { 
      if(httpxml.readyState==4) 
      { 
      document.getElementById("conpass_div").innerHTML=httpxml.responseText; 
      } 
     } 
    httpxml.onreadystatechange=stateck; 
    conpassword_url="ajax_password.php?password=" + password.value + "&conpassword=" + conpassword.value; 
    httpxml.open("GET",conpassword_url,true); 
    httpxml.send(null); 
} 


</script> 

<body> 
<div id="user_div"></div> 
<div id="conpass_div"></div> 
<div id="email_div"></div> 
<form id="form" name="form" method="post" action=""> 
<label>Username<br /> 
     <input type="text" name="username" id="username" onBlur="check_username(username)"> 
     <br /> 
<br /> 
    </label> 

    <label>Password<br /> 
    <input type="password" name="password" id="password" onBlur="check_confirm  (password,conpassword);"> 
    </label>  

    <label><br /> 
    <br /> 
    Confirm Password<br /> 
    <input type="password" name="conpassword" id="conpassword" onBlur="check_confirm(password,conpassword);"> 
    <br /> 
    <br /> 
    </label>  

<label>Email<br /> 
<input type="text" name="email" id="email" onblur="check_email(email)" /> 
    <p> 
    <p> 
    <label> 
     <input type="submit" name="button" id="button" value="Submit" onclick="return false;" /> 
     </label> 
    </p> 
</form> 
</body> 
</html>

출처

2009-05-01 Elliott

여기에 질문이 있습니까? –

모든 텍스트 상자가 '확인'되면 사용자가 제출 버튼 만 누를 수 있도록하는 방법을 이해할 수 없습니다. 예 .... 어떻게? – Elliott

시작 아웃 비활성화 :

<input type="submit" name="submit" id="button" disabled>

기본적으로

.. 그런

var userNameOk; 
var passwordOk; 
var emailOk; 

function checkCanSubmit() { 
    if (userNameOk && passwordOk && emailOk) { 
    document.getElementById("button").disabled= false; 
    else 
    document.getElementById("button").disabled= true; 
}

수정할 것이다 당신의 익명 메소드는 각 check 함수가 적절한 상태 플래그를 갱신하고 checkCanSubmit() 메소드를 호출합니다.

function stateck() 
    { 
      if(httpxml.readyState==4) 
      { 
       if (httpxml.response.Text == "whateverisvalid") { 
       emailOk = true; 
       } else { 
       emailOk = false; 
       } 
       checkCanSubmit(); 
       document.getElementById("email_div").innerHTML=httpxml.responseText; 
      } 
    }

BTW, 당신이 (아마도 영원히) 저장됩니다 .. 어떤에 any 수를 볼 수있는 세계에 대해 ... 쿼리 문자열에 .. 사용자 이름과 암호를 전송하고 있다는 사실에 의문을 제기 것 라우터 로그, snifferes, 프록시 서버 .. 및 웹 서버 로그 파일.

더 좋고/더 깨끗한/더 똑똑한 방법이 없습니까?

출처

2009-05-01 14:02:04 datacop

고마워요. 그걸 시도 할께. . 예를 들어 .... 정보를 암호화하려고합니다. 아직 완성 된 스크립트는 아닙니다. Thamks – Elliott

한가지 더 어떻게하면 기본적으로이 버튼이 비활성화되어 있습니까? 페이지가로드 될 때 ...? – Elliott

입력 된 단추를 사용하지 못하도록 마크 업하는 방법을 보여주기 위해 내 대답을 수정하고 checkCanSubmit()을 수정했습니다. – datacop

이 검사를 수행하려면 입력을 확인한 후에 다른 모든 입력이 이미 검증되었는지 확인하십시오. 유효한 입력을 보관할 전역 배열을 만들어야합니다.

이 유효성 검사를 수행하는 경우에도 양식이 실제로 제출되면 유효성 검사를 다시 수행해야합니다. 왜냐하면 악의적 인 사용자가 여전히 유효하지 않은 입력 데이터를 보낼 수 있기 때문입니다. 당신의 입력 버튼을 사용하면 상태 플래그 및 검사 루틴이 필요

출처

2009-05-01 13:51:36

고마워 이미 유효성 검사를 할 때마다 하나씩 추가하는 등의 전역 배열을 사용해 보았습니다. 그런 다음 배열이 4 인 경우 if 문을 수행합니다. 하지만 페이지가 오류를 보여주는 새로 고침하지 않도록 제출 버튼을 '사용'하는 방법을 모릅니다. – Elliott

Ajax 양식 유효성 검사

답변

관련 문제