Проверка формы Ajax

Я создал проверку формы с помощью ajax/php. Каждое текстовое поле проверяется с использованием другого файла, например. username_ajax.php. Как только информация будет проверена, чтобы быть в порядке, она затем отображается на экране («Username ok»). Я не могу понять, как разрешить пользователю только нажать кнопку отправки, как только все текстовые поля «ОК». Любая помощь будет оценена, спасибо.Проверка формы 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; 
}

Тогда вы бы изменить ваш анонимные методы для каждой функции проверки, чтобы обновить соответствующий флаг состояния и вызвать метод 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; 
      } 
    }

Кстати, я бы вопрос о том, что вы отправляете имя пользователя и пароль .. на строку запроса .. для всего мира, чтобы увидеть .. Какие будут сохранены (возможно, навсегда) в любое число журналов маршрутизатора, сниферов, прокси-серверов и файлов журналов веб-серверов.

Нет ли лучшего/более чистого/более умного способа сделать это?

источник

2009-05-01 14:02:04 datacop

Спасибо, я попробую, что и да о secuirty .... Я собираюсь зашифровать отправленную информацию. Это еще не готовый скрипт. Thamks – Elliott

Еще одна вещь Как бы отключить кнопку по умолчанию? например, когда страница загружается ...? – Elliott

Я изменил свой ответ, чтобы показать, как разблокировать кнопку ввода для отключения и зафиксировать checkCanSubmit() .. enjoy :) – datacop

Установите кнопку отправки на отключенное пока все входы не были подтверждены.

Чтобы сделать это, при проверке любого ввода проверьте, все ли уже проверены все другие входы. Вам нужно будет создать глобальный массив для хранения входов.

Обратите внимание, что даже если вы выполняете эту проверку, вы также должны повторно выполнить проверку, как только форма будет отправлена, поскольку вредоносный пользователь все равно может отправлять недопустимые входные данные.

источник

2009-05-01 13:51:36

Спасибо Я уже пробовал использовать глобальный массив ... например, добавлял один каждый раз при его проверке. Затем выполните оператор if, если массив равен четырем. Но я не знаю, как «включить» кнопку отправки, чтобы страница не обновлялась, показывая ошибку? – Elliott

Проверка формы Ajax

ответ

Смежные вопросы