Проверка формы Ajax - PullRequest
Новая
       6

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

0 голосов
/ 01 мая 2009

Я создал проверку формы, используя ajax / php. Каждое текстовое поле проверяется с использованием другого файла, например, username_ajax.php. Как только информация проверена, чтобы быть в порядке, она затем отображается на экране («Имя пользователя в порядке»). Я не могу понять, как разрешить пользователю нажимать кнопку «Отправить» только тогда, когда все текстовые поля в порядке. Любая помощь будет оценена, спасибо.

Мой код (Извините, что долго): 

<!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>

Ответы [ 2 ]

0 голосов
/ 01 мая 2009

Вы должны иметь флаги состояния и процедуру проверки.

Начните с отключенной кнопки ввода: 

<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;
            }
    }

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

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

0 голосов
/ 01 мая 2009

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

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

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

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...