Database rows not displaying fully in HTML table

Question

I am attempting to display mySQL data in a HTML table through php. The first row is displaying correctly, however the other row sets are not being organised and displayed in my table, rather just echoing out at the bottom of the container with no structure.

I think that since the data is being displayed, albeit not in the table, that my query is correct, im just unsure on how to proceed.

Is this an issue with my table structure?

I tried adding a second:

 echo '<td>' . $data['studentNumber'] . '</td><td>' . $data['handle'] . '</td><td>' . $data['email'] . '</td>'; 

underneath my first echo, but it just duplicated everything.

Here is the entire code in question: Screenshot Here

<div class="container-fluid">
            <div class="row">
                <div class="col-md details">  
                    <p class="details_title"></p>                 
                    <?php
                    $getAllStudentsTable = "SELECT * FROM users WHERE accessLevel = 3";
                    $result = (mysqli_query($conn, $getAllStudentsTable));

                    echo '<table class="table">
                          <thead class="thead-dark">';  
                    echo' <tr>                        
                          <th scope="col">Student Number</th>
                          <th scope="col">Handle</th>
                          <th scope="col">Email Address</th>
                          </tr>
                          </thead>'; //table headers

                    while ($data = mysqli_fetch_array($result))  {                      
                        echo' <tbody> <tr>'; 
                        echo '<td>' . $data['studentNumber'] . '</td><td>' . $data['handle'] . '</td><td>' . $data['email'] . '</td>'; 
                        echo'</tr>  </tbody> </table>'; 
                    }
                    ?> 

Can anyone point me in the right direction on this?

(I am relatively new to PHP, SO and this is the first attempt ever at trying to display database data into an HTML table.)

I have attached a link for a screenshot of the issue (Not yet allowed to post pictures lol).

Thanks!

Answer 1

You're echoing most of the table structure in your loop, where you should just be echoding the rows. As a necessary debugging step, take a look at the View Source in your browser and see what the table structure is. You'll find multiple <tbody> elements and multiple closing </table> tags, confusing the browser.

Basically, remove the various <tbody> and <table> tags from your loop and just echo them around the loop. Something like this:

echo '<tbody>'; 
while ($data = mysqli_fetch_array($result))  {                      
    echo '<tr>'; 
    echo '<td>' . $data['studentNumber'] . '</td><td>' . $data['handle'] . '</td><td>' . $data['email'] . '</td>';
    echo '</tr>'; 
}
echo '</tbody></table>';

All you want to repeat in the loop is each <tr> element and its children.