Question

我使用PHP，AJAX，html将mysql数据显示到表中，我设法使用ajax传递数据，因为我可以在开发控制台中显示它，但无法将其输出到表中，我认为我要么缺少了一点，要么在表格部分中写的不正确，但是它不会返回错误，它只会返回item.beacon。

编辑：在推荐使用APPEND之后，我将代码更新为以下内容，但是即使数据仍然存在，它也不返回错误或任何数据。

如果需要更多信息，我将更新问题以将其包括在内。

PHP

<?php
header('Content-type: application/json');
$servername = "localhost";
$username = "user";
$password = "password";
$dbname = "test";

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
} 
#   header('Content-Type: applicaton/json');

$sql = "SELECT 
* 
FROM
(SELECT
  beacon,location,date,
  COUNT(location) AS counter 
FROM `track`
WHERE `date` = CURDATE() and `time` > NOW() - interval 60 second
GROUP BY beacon) AS SubQueryTable
ORDER BY SubQueryTable.counter DESC;";
$result = $conn->query($sql);


$result = mysqli_query($conn ,  $sql);
   $rows = array();
  while($r = mysqli_fetch_assoc($result)) {
  $rows[] = $r;
   }

   echo json_encode($rows);
$conn->close();
?>

HTML

<!DOCTYPE html>

<html>
 <head>
 <title>PHP MySQL</title>
 <script src='https://code.jquery.com/jquery-2.1.3.min.js'></script>
 </head>

 <body>
<script>
$(document).ready(function(){
 $.ajax({   
    type: "POST",
    url: "fetch.php",
    data: "getrow",
}).done(function( data ) {
    $('table').append('<tr><td>'+data['beacon']+'</td></tr><tr> <td>'+data['location']+'</td></tr>'); 
}).fail(function(jqXHR, textStatus) {
    alert('Request Failed');
});
}); 
</script>


<script src="vendor/jquery/jquery.min.js"></script>
<script>
var sec = 0;

function pad(val) {
return val > 9 ? val : "0" + val;
}
var timer = setInterval(function () {
$(".seconds").html(pad(++sec % 60));
$(".minutes").html(pad(parseInt(sec / 60, 10)));
}, 1000);
</script>
 </body>
</html>

Answer 1

尝试下面的代码。我只是评论了id，因为在您的sql查询中没有看到id。请确保包括您的jquery文件。

如果您尝试使用get和post方法

  type: 'get',
   type: 'post',

运行下面的代码，它将起作用

        <script src="jquery-3.1.1.min.js" type="text/javascript"></script>



<script type="text/javascript">
$(document).ready(function(){
    $.ajax({
        url: 'fetch.php',
        type: 'get',
//type: 'post',
        dataType: 'JSON',
        success: function(response){
            var len = response.length;
            for(var i=0; i<len; i++){
                //var id = response[i].id;
                var beacon = response[i].beacon;
                var location = response[i].location;


                var tr_str = "<tr>" +
                    "<td align='center'>" + (i+1) + "</td>" +
                    "<td align='center'>" + beacon + "</td>" +
                    "<td align='center'>" + location + "</td>" +
                    "</tr>";

                $("#userTable tbody").append(tr_str);
            }

        }
    });
});

</script>

    </head>
    <body>
        <div class="container">
            <table id="userTable" border="1" >
                <thead>
                    <tr>
                        <th width="5%">S.no</th>
                        <th width="20%">Beacon</th>
                        <th width="20%">Location</th>

                    </tr>
                </thead>
                <tbody></tbody>
            </table>
        </div>
    </body>
</html>

使用Ajax

1 个答案: