CODEWITHSUNDEEP
javascripthtmlhtml-table
L. de Boer
L. de Boer

Reputation: 88

Javascript output online usernames in HTML table

I made a server that checks if people are online if they logged in, and want to put that information into a html table.

<?php
session_start();
include_once '../php\connect.php';
function removeRefresh(){
    $query = connection()->prepare("UPDATE `online` SET `time` = `time`+1");
    $query->execute();
    $query = connection()->prepare("DELETE FROM `online` WHERE `time` > 5");
    $query->execute();
}
function addOrRefresh($ID){
    $query = connection()->prepare("SELECT COUNT('id') FROM `online` WHERE `ID` = :ID");
    $query->bindParam(':ID', $ID);
    $query->execute();
    $count = $query->fetchColumn();
    if($count == 0){
        $query = connection()->prepare("INSERT INTO `online`(`ID`, `time`) VALUES(:ID, 0)");
        $query->bindParam(':ID', $ID);
        $query->execute();
    }
    else{
        $query = connection()->prepare("UPDATE `online` SET `time` = 0 WHERE `ID` = :ID");
        $query->bindParam(':ID', $ID);
        $query->execute();
    }
}
$action = filter_input(INPUT_GET, 'action');
if($action == 'heartbeat'){
    removeRefresh();
    $ID = $_GET['id'];
    addOrRefresh($ID);
    $query = connection()->prepare("SELECT u.username FROM `nusers` u INNER JOIN `online` o ON o.ID = u.ID");
    $query->execute();
    $onlineUsers = $query->fetchAll(PDO::FETCH_ASSOC);
    $resultaat = "";
    foreach($onlineUsers as $user){
        $resultaat .= "<p>{$user['username']} <br></p>";
    }
    echo "$resultaat";
}

?>

You can register, and when you log in into the lobby, you are added into an 'online' table, that checks every second with the function 'heartbeat'.

Please excuse my poor English.

EDIT: I have systems working. I merely want to change the 'echo "$resultaat"' so that it puts the $resultaat into a tablerow. adding after a '}' won't work, I've tried working around that, not certain if I tried all posibilities in that retrospect. After request, I've posted the entire document. the other javascript part is integrated into another document; containing:

   <?php
session_start();
$ID = $_SESSION['ID'];


if (isset($_POST['logout'])) {
    session_destroy();
    $query = connection()->prepare("DELETE FROM `online` WHERE `ID` = :ID");
    $query->bindParam(':ID', $ID);
    $query->execute();
}
?>

<html>
    <head>
        <title>Stratego</title>
        <Link href="../layout/style.css" type="text/css" rel="stylesheet" />
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

        <script src="./js/HeartBeat.js"></script>
        <script>
            $(document).ready(function () {
                heartbeat.setSpelerId( <?php echo $ID; ?> );
                heartbeat.polling();
            });
        </script>
    </head>
    <body>
        <form method='post' name='logout' action="../setup/logout.php">
            <input type='submit' name='loggout' value='Log me out'>            
        </form>
        <a href="lobby1.php">Singleplayer</a>
        <div id="online-list">
        </div>
    </body>

    <?php echo "<script>
        function heartbeat(){
            var xhttp = new XMLHttpRequest();
            xhttp.onreadystatechange = function() {
              if (xhttp.readyState == 4 && xhttp.status == 200) {
               console.log(xhttp.responseText);
               document.getElementById(\"online-list\").innerHTML = xhttp.responseText;
              }
            };
            xhttp.open(\"GET\", \"./wachtruimterInterface.php?action=heartbeat&id=" . $ID . "\", true);
            console.log('keeping in touch ༼つ ◕_◕ ༽つ');
            xhttp.send();
        }
        setInterval(heartbeat, 1000);
    </script>"; ?>
</html>

The console log is there to check if the connection is being maintained. People use their ID to login, no passwords.

This is how it looks now, with 1 person being online; named Luuk. http://www.filedropper.com/screenproof My goal is to get all the people that are online into a table. I've tried 

        $resultaat .= "<tr><td>{$user['username']} <br></td></tr>";
}
echo "<table>$resultaat</table>";

Just now, doesn't seem to work, any tips on how to progress?

Upvotes: 0

Views: 78

Answers (1)

L. de Boer
L. de Boer

Reputation: 88

I've fixed the issue;

    $resultaat = "";
foreach($onlineUsers as $user){
    $naam= $user['username']
    $resultaat .= "<tr><td>$naam</td></tr>";
}
echo "<table border=1>$resultaat</table>";

Upvotes: 1

Related Questions