没有数据消息显示

时间:2017-11-05 19:51:33

标签: php jquery json ajax

这段代码,我已经完成了注册号码的搜索。所有代码都正确且运行正常但未找到匹配数据。没有显示消息。所以,我想在未找到匹配数据时显示消息"未找到此类数据"。 我怎样才能做到这一点?请帮忙解决这个问题, 我的代码如下。

的index.php

    <!DOCTYPE html>
<html>
 <head>
  <title>How to return JSON Data from PHP Script using Ajax Jquery</title>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  <style>
  #result {
   position: absolute;
   width: 100%;
   max-width:870px;
   cursor: pointer;
   overflow-y: auto;
   max-height: 400px;
   box-sizing: border-box;
   z-index: 1001;
  }
  .link-class:hover{
   background-color:#f1f1f1;
  }
  </style>
 </head>
 <body>
  <br /><br />
  <div class="container" style="width:900px;">
   <h2 align="center">How to return JSON Data from PHP Script using Ajax Jquery</h2>
   <h3 align="center">Search Employee Data</h3><br />   
   <div class="row">
    <div class="col-md-4">
     <input type="text" name="employee_list" id="employee_list" class="form-control">

    </div>
    <div class="col-md-4">
     <button type="button" name="search" id="search" class="btn btn-info">Search</button>
    </div>
   </div>
   <br />
   <div class="table-responsive" id="employee_details" style="display:none">
   <table class="table table-bordered">
    <tr>
     <td width="10%" align="right"><b>Name</b></td>
     <td width="90%"><span id="name"></span></td>
    </tr>
    <tr>
     <td width="10%" align="right"><b>Address</b></td>
     <td width="90%"><span id="address"></span></td>
    </tr>

    <tr>
     <td width="10%" align="right"><b>Gender</b></td>
     <td width="90%"><span id="total_marks"></span></td>
    </tr>
    <tr>
     <td width="10%" align="right"><b>Designation</b></td>
     <td width="90%"><span id="email"></span></td>
    </tr>
    <tr>
     <td width="10%" align="right"><b>Age</b></td>
     <td width="90%"><span id="ph"></span></td>
    </tr>
   </table>
   </div>

  </div>
 </body>
</html>

<script>
$(document).ready(function(){
 $('#search').click(function(){
  var enroll= $('#employee_list').val();
  if(enroll != '')
  {
   $.ajax({
    url:"fetch.php",
    method:"POST",
    data:{enroll:enroll},
    dataType:"JSON",
    success:function(data)
    {
    if(data.length != 0){

     $('#employee_details').css("display", "block");
     $('#name').text(data.name);
     $('#address').text(data.address);
     $('#total_marks').text(data.total_marks);
     $('#ph').text(data.ph);
     $('#email').text(data.email);
    }
    else { alert("Please Select Employee"); }
   }

   })
  }

  else
  {
   alert("Please Select Employee");
   $('#employee_details').css("display", "none");
  }
 });
});
</script>

fetch.php

  <?php
//fetch.php
if(isset($_POST["enroll"]))
{
 $connect = mysqli_connect("localhost", "root", "", "aviation");
 $query = "SELECT * FROM student WHERE enroll = '".$_POST["enroll"]."'";
 $result = mysqli_query($connect, $query);
 if(mysqli_num_rows($result)>0)
 {
 while($row = mysqli_fetch_array($result))
 {
  $data["name"] = $row["name"];
  $data["address"] = $row["address"];
  $data["total_marks"] = $row["total_marks"];
  $data["email"] = $row["email"];
  $data["ph"] = $row["ph"];

 }

 echo json_encode($data);
}
}
?>

2 个答案:

答案 0 :(得分:1)

你可以添加

 error: function(){
  alert('No Such Data Found!');
}

success:function(data)

之后

所以你的ajax调用就像:

  $.ajax({
url:"fetch.php",
method:"POST",
data:{enroll:enroll},
dataType:"JSON",
success:function(data)
{
if ($.trim(data)){  
 $('#employee_details').css("display", "block");
 $('#name').text(data.name);
 $('#address').text(data.address);
 $('#total_marks').text(data.total_marks);
 $('#ph').text(data.ph);
 $('#email').text(data.email);}
 else{alert('No Such Data Found!')}
},
 error: function(){
  alert('error !');
}

或在php代码中添加else,如果结果为空则返回false:

  if(mysql_num_rows($result)>0)
 {
while($row = mysqli_fetch_array($result))
 {
 //code ......
}

echo json_encode($data);

}else {
 return false;
 }

然后你的ajax调用就像:

  $.ajax({
url:"fetch.php",
method:"POST",
data:{enroll:enroll},
dataType:"JSON",
success:function(data)
{
 if(data != false){ 
$('#employee_details').css("display", "block");
$('#name').text(data.name);
$('#address').text(data.address);
$('#total_marks').text(data.total_marks);
$('#ph').text(data.ph);
$('#email').text(data.email);}else{alert('No Such Data Found!');}
}

答案 1 :(得分:1)

在PHP代码中,您将使用循环来获取数据库行。但是你的PHP代码就像你只收到一行数据一样。

除非您另有说明,否则我会考虑您只获得1行数据。

您已经检查过mysql是否返回1个或更多结果。 因此,我们所需要的只是一个变量,告诉您是否找到了结果。

示例:

<?php
$output = array(
    'result' => 0
);

if (isset($_POST["enroll"])) {
    $connect = mysqli_connect("localhost", "root", "", "aviation");
    $query = "SELECT name,address,total_marks,email,ph FROM student WHERE enroll = '" . $_POST["enroll"] . "'";
    $result = mysqli_query($connect, $query);
    if (mysql_num_rows($result) == 1) {
        $output['row'] = mysqli_fetch_array($result);
        $output['result'] = 1;
    }
}

echo json_encode($output);

然后,如果你的javascript代码,你只需要测试data.result是否等于1或0并相应地采取行动。示例:

<script>
    $(document).ready(function () {
        $('#search').click(function () {
            var enroll = $('#employee_list').val();
            if (enroll != '')
            {
                $.ajax({
                    url: "fetch.php",
                    method: "POST",
                    data: {enroll: enroll},
                    dataType: "JSON",
                    success: function (data)
                    {
                        if(data.result == 1){
                            $('#employee_details').css("display", "block");
                            $('#name').text(data.row.name);
                            $('#address').text(data.row.address);
                            $('#total_marks').text(data.row.total_marks);
                            $('#ph').text(data.row.ph);
                            $('#email').text(data.row.email);
                        }
                        else{
                            alert("No Such Data Found");
                        }
                    }
                })
            } else
            {
                alert("Please Select Employee");
                $('#employee_details').css("display", "none");
            }
        });
    });
</script>

编辑:小心,你还应该在你的mysql查询中使用它之前清理POST变量