使用Ajax将mysql值回显到表中

Question

Im, using PHP,AJAX,html to display mysql data into a table, I have managed to pass the data across using ajax as i can display it in the dev console but i can't get it to output to the table, I think im either missing a bit or have written in the table part incorrectly but it doesn't return errors it just returns item.beacon. 即时通讯，使用PHP，AJAX，html将mysql数据显示到表中，我设法使用ajax传递数据，因为我可以在开发控制台中显示它，但是我无法将其输出到表中，我认为即时消息要么丢失了一点，要么在表部分中写的不正确，但是它没有返回错误，它只返回item.beacon。

EDIT: after a recommendation to use APPEND I have updated the code to the below but it returns neither a error or any data even though data is still present. 编辑：在推荐使用APPEND之后，我已将代码更新为以下代码，但即使数据仍然存在，它也不返回错误或任何数据。

if there is any more information needed i will update the question to include it. 如果还有更多信息需要，我将更新问题以将其包括在内。

PHP 的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 的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

Try the code below. 试试下面的代码。 I just commented the id because I do not see Id in your sql queries. 我只是评论了id，因为在您的sql查询中没有看到id。 Please ensure to include your jquery files. 请确保包括您的jquery文件。

If you try either get and post method 如果您尝试使用get和post方法

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

Run the code below and it will work 运行下面的代码，它将起作用

        <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将mysql值回显到表中

问题描述

1 个解决方案

解决方案1
2 已采纳 2019-02-25 16:31:53

使用Ajax将mysql值回显到表中

问题描述

1 个解决方案

解决方案1 2 已采纳 2019-02-25 16:31:53

解决方案1
2 已采纳 2019-02-25 16:31:53