看来我的Ajax可以用,但是什么也没发布

时间:2019-05-29 05:31:37

标签: javascript php jquery ajax

我正在尝试将选择器的值发布到php文件中,但是它不起作用。我的成功功能有效,当我转到“ your_php_script.php”时,该页面有效,并且php按预期运行。为什么用ajax在页面上不显示php页面?我编辑了帖子,以从database_connection.php添加数据库连接功能

// html & jquery
 <select name="rooftop" id="rooftop" class="selectMenu">
            <option value="">Select an option</option>
            <option value="Yes">Yes</option>
            <option value="No">No</option>
        </select>


    <button id="barButton">click</button>

    <div id="showBars">

    </div>


    <script type="text/javascript">

        $(document).ready(function(){

                          $("#barButton").click(function() {
                            var selected = $("#rooftop").val();
                            $.ajax({
                                   type: "POST",
                                   url: "your_php_script.php",
                                   data: {selected: selected},
                                   success: function(){
                                   alert("works");
                                   }

                            });
                          });

// code on your_php_script.php
<?php

require_once("database_connection.php");
$db = db_connect();

 echo "<script type='text/javascript'> alert('works1'); </script>";
    $selected = $_POST["selected"];
    if(isset($selected)){
        echo "<script type='text/javascript'> alert('works2'); </script>";
        $sql = "SELECT bar_name, area, hourStart, hourEnd FROM barInfo WHERE rooftop = 1";
        $result = mysqli_query($connection, $sql);
        if (mysqli_num_rows($result) > 0) {
            echo "<table id='list'><tr><th><h3>Name</h3></th><th><h3> Area</h3></th><th><h3>Happy Hour Times</h3></th></tr>";
            while($row = mysqli_fetch_assoc($result)) {
                echo "<tr> <th> <h6> " . $row["bar_name"] . "</h6> </th> <th> <h6>" . $row["area"] . "</h6> </th> <th> <h6>" . $row["hourStart"] . "-" . $row["hourEnd"] . "</h6> </th> </tr>";
            }
            echo "</table";
        }

    }
db_disconnect($db);

?>


// database connection
function db_connect() {
        global $connection, $servername, $username, $password, $database;
        $connection = new mysqli($servername, $username, $password, $database) or die("Unable to Connect");
        return $connection;
    }

2 个答案:

答案 0 :(得分:0)

首先,由于您在php响应中使用echo,因此必须定义Ajax请求中将有一个响应。

所以您的Ajax将被类似这样的东西

$.ajax({
    type: "POST",
    dataType: "text"
    url: "your_php_script.php",
    data: {
        selected: selected
    },
    success: function() {
        alert("works");
    }
});

答案 1 :(得分:0)

正如您提到的,结果中的行数不超过0,这意味着$ connection的定义不正确,或者数据库barInfo = 1中没有这样的条目,因此它不返回任何内容。 / p>

因此,首先应该检查database_connection.php文件是否与数据库的连接正确完成,因为可能是该文件(your_php_script.php)没有获得{{1} } $connection中的文件。

此外,正如我之前提到的,dataType很重要(虽然不是强制性的)。更为重要的是将传入数据附加到apt中。元素,您的成功功能应类似于:

database_connection.php

使用ajax时要记住的事情:

1)确保正确定义$.ajax({ type: "POST", dataType: "html" url: "your_php_script.php", data: { selected: selected }, success: function(result) { alert("works"); jQuery("#showBars").html(result); }, error: function(error) { alert(error); } }); 属性。如果未指定任何内容,则jQuery将尝试根据响应的MIME类型进行推断。

2)dataType函数应正确定义传入数据的用法,以及如何在HTML视图中使用它们。

3)养成使用Success函数的习惯,因为当它没有进入error函数并且有任何错误时,它将帮助您获得错误。