Как проверить ввод, чтобы узнать, соответствует ли он записи в базе данных

Question

Я пытаюсь создать вход, который запрашивает базу данных и возвращает, существует ли результат в базе данных. Я частично работаю, но мой ящик светится зеленым, когда я набираю только одно письмо. Было бы лучше, если бы он оставался красным, пока он не нашел точное совпадение, а затем стал зеленым. Edit: Я только что понял, что с моим запросом тоже что-то не так. Теперь он корректно запрашивает базу данных. Первоначальная проблема - моя главная проблема.

$(document).ready(function(){ 
    $("#load").keyup(function (e){ 
     e.preventDefault(); 
     ; 

    searchRequest = $.ajax({ 
     url: 'check_load_no.php', 
     data: $('#load').serialize(), 
     type: 'POST', 
     success: function (data) { 
      $(".verify").css('box-shadow', '0px 0px 9px 2px #84f850'); 
      $(".error").css('display', 'none'); 
      $(".success").css('display', 'block'); 

     }, 
     error: function (data) { 
      $(".verify").css('box-shadow', '0px 0px 9px 2px #ad0037'); 
      $(".success").css('display', 'none'); 
      $(".error").css('display', 'block'); 
     } 

    }); 

    }); 
    }); 

Ниже мой PHP

<?php include('../model/conn.php'); ?> 
<?php include('../model/conn2.php') ?> 

<?php 
$sql = "SELECT cmt_2 FROM oeordhdr_sql WHERE cmt_2 = '{$_POST['load']}'"; 
$query = (odbc_exec($conn,$sql)); 
$row = (odbc_fetch_row($query)); 
if($row['cmt_2']){ 
    echo 'yeah'; 
} 

HTML

<h1>Please add the info based on your load number</h1> 
     <form action="" method="post"> 
     <div class="card" > 
      <input class="verify" id="load" type="text" name="load" placeholder="Load Number" required/> 
    <span class="error" style="display: none;"><i class="fa fa-exclamation-triangle fa-lg" aria-hidden="true"> </i>I'm not finding anything</span> 
    <span class="success" style="display: none;"> <i class="fa fa-check-cube fa-lg" aria-hidden="true"> </i> Congratulations, that record exists!</span><br> 
<button class="update_button" type="submit" name="add" value="update">Update</button></div></form> 

Answer 1

Решил вывести сообщение об ошибке/успеха с помощью PHP вместо изменения CSS

$("#load").keyup(function (e){ 
     e.preventDefault(); 


    searchRequest = $.ajax({ 
     url: 'check_load_no.php', 
     data: $('#load').serialize(), 
     type: 'POST', 
     success: function (data) { 
      console.log(data); 
      if(data==="yeah") 
      { 
       $(".validate").html(data); 

      } 
      else 
      { 
       $(".validate").html(data); 


      } 
     } 

    }); 

    }); 

Мой PHP

$sql = "SELECT cmt_2 FROM oeordhdr_sql WHERE cmt_2 LIKE '{$_POST['load']}'"; 
    $query = odbc_exec($conn,$sql); 
    $row = (odbc_fetch_row($query)); 
    if($row){ 
     echo '<span class="success" style="display: block;"> <i class="fa fa-check-cube fa-lg" aria-hidden="true"> </i> Congratulations, that record exists!</span>'; 

    }else{ 
     echo'<span class="error" style="display: block;"><i class="fa fa-exclamation-triangle fa-lg" aria-hidden="true"> </i>I\'m not finding anything</span>'; 
    } 

Мой HTML

<h1>Please add the info based on your load number</h1> 
     <form action="" method="post"> 
     <div class="card" > 
      <input class="verify" id="load" type="text" name="load" placeholder="Load Number" required/> 
    <div class="validate"></div><br> 
<button class="update_button" type="submit" name="add" value="update">Update</button></div></form> 

Answer 2

success: function (data) { 
    if(data==="yeah") 
    { 
     $(".verify").css('box-shadow', '0px 0px 9px 2px #84f850'); 
     $(".error").css('display', 'none'); 
     $(".success").css('display', 'block'); 
    } 
    else 
    { 
     $(".verify").css('box-shadow', '0px 0px 9px 2px #ad0037'); 
     $(".success").css('display', 'none'); 
     $(".error").css('display', 'block'); 
    } 
} 

проверить, если ответ это то, что вам нужно, и только потом добавить .success класс

Answer 3

Y наш обработчик ошибок не будет вызван, даже если «да» не будет отображаться скриптом PHP, поскольку ответ сервера будет по-прежнему являться HTTP 200. По этой причине ваш обработчик успеха всегда будет запускаться (если, конечно, не существует реальной проблемы с ваш сервер/приложение).

Если вы хотите вызвать обработчик ошибок, вам нужно будет отправить серверный код ответа 400 или 500 для HTTP-кода (вероятно, 404 в этом случае) для случая, когда совпадение не найдено.

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

Вы также должны рассмотреть вопрос о добавлении/удалении классов CSS в своих элементах DOM, а не о конкретном указании CSS в вашей функции. Это позволит вам позже изменить CSS, если это необходимо, без необходимости изменять эту функцию.