服务器发送的数据到表中

Question

I have a simple Server-sent event setup I'm trying to make display as a table. Currently I have the SSE php page pulling the data out of the MySQL table and sending the data over as a Json array to the live page. How would I be able to take the Json array and put that into a html table with out sending the array back as a post and causing the page to "refresh"?

Here is my current code

SSE.php

//get MySQL data
$new_data = getVar();
//Create Array
$data_array = array();
//add data to array
while($row = $new_data->fetch_assoc()){
    $data_array[] = $row;
    $out = array_values($data_array);
    $new_out = json_encode($out);
}
//echo the array to html page
echo "data: $new_out 

 }'";   

Index.html

<script type="text/javascript">
 //check for browser support
 if(typeof(EventSource)!=="undefined") {
 //create an object, passing it the name and location of the server side script
var eSource = new EventSource("send_sse.php");
//detect message receipt
eSource.onmessage = function(event) {
    //write the received data to the page
    //document.getElementById("serverData").innerHTML = event.data;
};

Where serverData is the div where the array is currently being shown

I have tried to echo data: multiple times or echo the html markup back but I couldn't make it work with out a php runtime error

thanks

Answer 1

You may want to make an AJAX request to the PHP script. This will allow the data from the database table to populate your page without refreshing. Check out this W3Schools example.

You can simplify the user defined JavaScript by using jQuery's AJAX functions (though you would have to load jQuery onto your page as well).