Как изменить отправку ввода с отключенного на включенное, когда электронная почта проверена на сервере с PHP? - PullRequest
Новая
       1

Как изменить отправку ввода с отключенного на включенное, когда электронная почта проверена на сервере с PHP?

0 голосов
/ 06 марта 2020

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

index. html

<!DOCTYPE html>
<html>
<head>    
</head>

<body>
  <div id="login-input">
    <form action="login.php" method="post" class="ajax">
      <p>
        <input id="login-username" type="text" name="username" placeholder="Username">
      </p>
      <p>
        <input id ="login-password" type="password" name="password" placeholder="Password">
      </p>
      <p>
        <input id="login-submit-btn" type="submit" value="LOGIN" disabled>
      </p>
    </form>
  </div>
</body>
</html>

main. js

  $(document).ready(function() {    

  $('form.ajax').submit(function(event) {

    var data = {
      username: $('#login-username').val(),
      password: $('#login-password').val()
    };

    $.ajax({
      url: "login.php",
      type: "POST",
      data: data,
      success: function(data) {
        event.preventDefault();
        console.log(data);
      }
    });

    return false;
  });
});

login. php

  <?php

  $input_username = $_POST['username'];
  $input_password = $_POST['password'];

  if(isset($input_username, $input_password)) {
    if(filter_var($input_username, FILTER_VALIDATE_EMAIL)) {
      echo " email format is valid ";
    }
    else {
      echo " email format is invalid ";
    }
  }
?>

Ответы [ 2 ]

1 голос
/ 06 марта 2020

вы можете проверить ответ в AJAX обработчике успеха и включить и отключить кнопку LOGIN на основе ответа

Login. php 

      $input_username = $_POST['username'];
      $input_password = $_POST['password'];

      if(isset($input_username, $input_password)) {
        if(filter_var($input_username, FILTER_VALIDATE_EMAIL)) {
          echo "valid";
        }
        else {
          echo "invalid";
        }
      }
    ?>

main. js

$(document).ready(function() {
  // select form and handle event with ON method
  $('form.ajax').on('submit', function() {

    var obj = $(this),
    url = obj.attr('action'),
    type = obj.attr('method'),
    data = {};

    // find anything with the attribute of name
    obj.find('[name]').each(function(index, value) {
      var credential = $(this),
      name = credential.attr('name'),
      value = credential.val();

      data[name] = value;
    });

    $.ajax({
      url: url,
      type: type,
      data: data,
      success: function(response) {
        event.preventDefault();
        if(response==="valid"){
          document.getElementById("login-submit-btn").disabled =false; 
        }else{
         document.getElementById("login-submit-btn").disabled = true; 
        }
       },
       error: function (error) {
         console.log(error);
        }

    });

    return false;
  });
});

и еще одна вещь, в этом, вероятно, нет необходимости, но нет смысла писать отключено = "отключено" на кнопке входа в систему, просто отключенная будет делать 

<input id="login-submit-btn" type="submit" value="LOGIN" disabled />
0 голосов
/ 07 марта 2020

Означает, что при использовании type = "email" пользователь не сможет нажать кнопку.

Вы не должны go так далеко. hTml имеет встроенную функцию. Только измените тип на Email

Например

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

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

...