Ошибка при отправке данных в php в моем ajax-коде

Question

Я пытался проверить адрес электронной почты, введенный в поле ввода, используя jQuery и Ajax. Кажется, что jQuery addClass и removeClass в моей проверке PHP не похоже на основной файл PHP.

Вот мой код: -

<table cellspacing="10px" cellspacing="5px" class="sign_up_table"> 

    <tr> 
     <td> 
     <input class="ui_input2 no_space inpt1913" id="input_email" type="email" name="i_email" style="height:25px; width:300px; font-size:16px;" required /> 
     </td> 
     <td id="input_email_error"> 
     <img src="img/a_loader.gif" id="a_loader_i" style="display:none; position:relative; top: 2px;" /> 
     </td> 
</table> 

Мой JQuery:

$(document).ready(function() { 
     $('#input_email').on('input',function(e){ 
      var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/; 
      var val_i_email = $("#input_email").val(); 

      var empty = false; 
      $('#input_email').each(function() { 
       if (val_i_email < 5 || !emailReg.test(val_i_email)) { 
        empty = true; 
       } 
      }); 

      if (empty) { 
       $(this).addClass("invalid"); 
       $(this).removeClass("valid"); 

       $email_valid = false; 

        } else { 
      var i_email = $("#input_email").val(); 
      $('#a_loader_i').show(); 

      $.ajax({ 
      type: "POST", 
      url: '/script/validate_email.php', 
      data: {i_email:i_email}, 
      cache: false, 
      success: function(){ 
       $("#a_loader_i").hide(); 

       $email_valid = true; 
       } 
      }); 
     } 
    }); 
}); 

PHP:

// include pdo config 
include_once ('config.php'); 

    // store the values submitted by form in variable 
    $email=$_POST['i_email']; 

    // query 
    foreach($pdo->query("SELECT * FROM Users WHERE email='$email'") as $row); { 
     if ($email == $row['Email']) { 
      echo "<script> 
        $('#input_email_error').append('This email has already been taken'); 
        $('#input_email').addClass('invalid'); 
        $('#input_email').removeClass('valid'); 
        $('#a_loader_i').hide(); 
        </script>"; 

     }else{ 
      echo "<script> 
        $('#input_email').addClass('valid'); 
        $('#input_email').removeClass('invalid'); 
        $('#a_loader_i').hide(); 
        </script>"; 
     } 
    } 

$pdo = null; 

Answer 1

Похоже, вы возвращаете HTML в вашем AJAX назовите, что вы ожидаете t o получить вызов. Вместо того, чтобы это сделать, попросите php вернуть закодированный JSON true/false, который вы проверите, а затем выполните обратный вызов успеха, выполнив логику, которую вы пытаетесь использовать в php.

В JavaScript сделать:

$.ajax({ 
      type: "POST", 
      url: '/script/validate_email.php', 
      data: {'i_email':i_email}, 
      cache: false, 
      success: function(data){ 
       if(data.valid) { 
        $('#input_email').addClass('valid'); 
        $('#input_email').removeClass('invalid'); 
        $('#a_loader_i').hide(); 
       } else { 
        $('#input_email_error').append('This email has already been taken'); 
        $('#input_email').addClass('invalid'); 
        $('#input_email').removeClass('valid'); 
        $('#a_loader_i').hide(); 
       } 
      }); 

И в PHP:

if ($email == $row['Email']) { 
     $valid = false; 
} else { 
     $valid = true; 
} 

echo json_encode(array('valid' => $valid)); 

У вас есть возвращение PHP, если адрес электронной почты является действительным или нет, и сама страница решает, что делать с этим ,

Answer 2

не видя config.php, я не могу увидеть мя полную картину, но я предполагаю, что вы должны echo json_encode($response); в вас PHP файл

$response должен содержать что-то вроде:

если электронная почта принимаются:

$response = array(
     'success' => true, 
     'note' => "Accepted" 
    ); 

или если адрес электронной почты существует/недействительны:

$response = array(
     'success' => false, 
     'note' => "This email has already been taken" 
    ); 

, а затем успеха в JQuery:

success: function(response){ 
     if(response.success){ 
      $('#input_email').addClass('valid'); 
      $('#input_email').removeClass('invalid'); 

     } else { 
      $('#input_email').addClass('invalid'); 
      $('#input_email').removeClass('valid'); 

     } 
     $('#input_email_error').append(response.note); 
     $('#a_loader_i').hide(); 
    } 

Answer 3

$email=$_POST['i_email']; в вашем PHP код выглядит для элемента с именем i_email в ваших почтовых значений. Если бы вы могли видеть строку, это выглядело бы как i_email=sting@mail.com (вероятно, кодировка url тоже).

В вашем AJAX вы определяете ключ так же, как и ваше значение. Так

else { 
     var i_email = $("#input_email").val(); //You define your variable. 

     $('#a_loader_i').show(); 

     $.ajax({ 
     type: "POST", 
     url: '/script/validate_email.php', 
     data: {i_email:i_email}, //Outputs as 'you@mail.com:you@mail.com' 
     cache: false, 
     success: function(){ 
      $("#a_loader_i").hide(); 

      $email_valid = true; 
      } 
     }); 
    } 

Вы хотели бы изменить i_email: i_email к email:i_email или что-то похож, а затем $_POST['email'] в вашем PHP.