MySQL查询结果没有显示使用AJAX

时间:2017-12-12 17:36:05

标签: php html mysql ajax

我有一个名为opera_house的数据库,其中有一个名为room的表,它有一个字段room_name和一个字段容量。我想显示容量大于用户输入容量的room_name。

可用房间文本消失了,但我的代码只显示MySQL查询,如果我回复它,但我不确定它是否到达搜索数据库。

这是我的脚本代码:

<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script type="text/javascript">
    function showRoom(str) {
        if (str === "") {
            document.getElementById("txtHint").innerHTML = "";
            return;
        } else { 
            if (window.XMLHttpRequest) {
                // code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp = new XMLHttpRequest();
            } else {
                // code for IE6, IE5
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlhttp.onreadystatechange = function() {
                if (this.readyState === 4 && this.status === 200) {
                    document.getElementById("txtHint").innerHTML = this.responseText;
                }
            };
            xmlhttp.open("GET","ajax_events.php?q="+str,true);
            xmlhttp.send();
        }
    }

这是我的HTML:

<body>
    <form>
        <input type="text" name="room" onkeyup="showRoom(this.value)">
    </form>
    <br>
    <div id="txtHint"><b>Available Room...</b></div>
</body>

这是我的php:

<?php
    include('dbconnect.php');
    $q = intval($_GET['q']);

    mysqli_select_db($connection,"opera_house");
    $sql="SELECT room_name FROM room WHERE capacity >= '".$q."'";
    echo $sql;
    $result = mysqli_query($connection,$sql);

    while($row = mysqli_fetch_array($result)) {
        echo "<td>" . $row['room_name'] . "</td>";
    }
?>

我的php文件名为ajax_events.php

我的dbconnect.php是我经常用来连接这个数据库的。

非常感谢一些帮助!!

2 个答案:

答案 0 :(得分:0)

我使用jquery提出答案。您已将其嵌入到您的问题中,但您并未使用它......

说明:只有在定义了ajax_events.php的情况下,才会使用参数"q"调用以下网址str,否则只会填充选择器txtHint

<强> AJAX

if (str != "") {
  $.ajax({
    type: 'GET',
    url: 'ajax_events.php',
    dataType: 'JSON',
    data : {
      q: str
    }
  }).done(function (data) {
    $('#txtHint').text = data;
  }).fail(function() {
    alert('Fatal error');
  })
} else {
  $('#txtHint').text = '';
}

使用此配置,在服务器端代码中返回echo json_encode的结果非常重要。

<强> PHP

<?php
  include('dbconnect.php');
  $q = intval($_GET['q']);

  mysqli_select_db($connection, "opera_house");
  $sql = 'SELECT room_name FROM room WHERE capacity >= '.$q; // Some corrections
  $result = mysqli_query($connection, $sql);

  $return = '';
  while($row = mysqli_fetch_array($result)) {
    $return .= '<td>' . $row["room_name"] . '</td>';
  }
  echo json_encode($return); // Return Json to ajax
?>

答案 1 :(得分:0)

在思考JS的时候很好。我认为问题出在php代码中。试试这个。

 <?php
    include('dbconnect.php');
    $q = intval($_GET['q']);

    mysqli_select_db($connection,"opera_house");
    $sql="SELECT room_name FROM room WHERE capacity >= " . $q;

    $result = mysqli_query($connection,$sql);

    if (!$result) {
        echo mysqli_error(); 
        exit();
    } // this is to do debugging. remove when you get it fixed

    $ret = ""; //variable to hold return string
    while($row = mysqli_fetch_array($result)) {
       $ret .= "<td>" . $row['room_name'] . "</td>";
    }

 echo $ret;