MySQL data fetching without page refresh

I've recently finished a prototype for a little Raspberry Pi website. The main page of the site displays current users found in the room (through bluetooth). I wanted this list updated regularly from data in a MySQL table, so no refresh is needed. When someone walks into or out of the room, the webpage shows almost instantly.

This is the solution I created:

index.html

    
        
            Present:
            
                     
            
        
    
    
            
                Absent:
                
                     
                
                    
    

var timer = setInterval(listLoad, 1000);

function listLoad(){
    $(function(){
       $("#list1").load("herelist.php");
       $("#list2").load("notherelist.php");
    });
}

herelist.php

connect_error) {
     die("Connection failed: " . $conn->connect_error);
} 

$sql = "SELECT firstname, lastname FROM room_Data WHERE attendance = 1";
$result = $conn->query($sql);

if ($result->num_rows > 0) {
     // output data of each row
     echo("")
     while($row = $result->fetch_assoc()) {
         echo ("". $row["firstname"]. " " . $row["lastname"] . "");
 }
     echo("");
} else {
     echo ("");
}

$conn->close();
?>  

notherelist.php

Same as herelist.php, just the where clause is = 0 instead of = 1

This project isn't for some major production scale, which is why I don't really mind hitting my MySQL server every second requesting a read. I actually like this solution a lot since it was my first time ever injecting PHP through jQuery and I thought it was a neat idea.

Is this a good solution for a personal project/school project? Or, is there something I should look into to improve this?

Personally, I hate having a setInterval in JS code, especially to
fetch live updates. I hate it even more when it is used for hitting
the server for a database read/write operation, irrespective the size
of project.

The code you have is quite good, considering that it was your first time. There are quite a few suggestions though. Read on:

• Instead of having 2 separate files to fetch data of attendance = 0 and attendance = 1, use a single file with a parameter passed via a GET or POST request.

• Instead of dumping the entire data as HTML, I'd suggest outputting the results as JSON so that it might be of use to other applications, without having to resort to HTML parsers. This helps if you think/plan on providing an API for other users to develop on.

• Since the data for room_data gets updated with an underlying python application, you can modify it to write the output to a static JSON file and hit this JSON content instead of executing a MySQL query every second. This will help as the browser will get a 304 response status from the server if the JSON was not updated since last fetch. Caching FTW ^_^

• Put the external script/stylesheets in head.

-
Since all you need for the MySQL to return is concatenated name string, do so in MySQL itself:

SELECT CONCAT(firstname, ' ', lastname) AS 'name'
FROM room_Data
WHERE attendance = :something

• Do not use h4 tags for list items.

If you follow (1) above, you won't need the (3). I strongly recommend using (3) though.

StackExchange Code Review Q#107518, answer score: 3