Я пытаюсь создать вход, который запрашивает базу данных и возвращает, существует ли результат в базе данных. У меня это частично работает, но мой ящик светится зеленым, когда я набираю только одну букву. Было бы лучше, если бы он оставался красным, пока не нашел точное совпадение, а затем не стал зеленым. Изменить: я только что понял, что с моим запросом что-то не так. Теперь он правильно запрашивает базу данных. Оригинальный вопрос — моя главная проблема.
$(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>
Ваш обработчик ошибок не будет вызван, даже если PHP-скрипт не отобразит «yes», поскольку ответ сервера по-прежнему будет HTTP 200. По этой причине ваш обработчик успеха будет срабатывать всегда (если, конечно, нет реальной проблемы с ваш сервер / приложение).
Если вы хотите запустить обработчик ошибок, вам потребуется, чтобы сервер отправил HTTP-код ответа серии 400 или 500 (вероятно, 404 в этом случае) для случая, когда совпадение не найдено.
С другой стороны, вы можете просто поместить всю свою логику в обработчик успеха и вообще не изменять свой код на стороне сервера. Вам просто нужно проверить наличие «да» или нет.
Вам также следует подумать о добавлении / удалении CSS-классов в ваших элементах DOM, а не о конкретном указании CSS-кода в вашей функции. Это позволит вам позже изменить CSS при необходимости, без необходимости изменять эту функцию.
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
Решил вывести сообщение об ошибке / успех, используя 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>