Data populating outside HTML tags

Question

I have a view that I'm populating with results from my db in a table I'm doing it like this:

<table>
    <tr>
        myHeader
    </tr>

    <?php
        if(isset($records)){
            foreach($records as $row){
                echo "<tr>";
                echo $row->name;
                echo "</tr>";
            }
        }   
    ?>
</table>

The problem is that it isn't populating my table correctly. It populates everything outside the table.

Output

<div class="grid-50">
    MyHeader
    user1user2user3user4
    <table>
        <tbody>
            <tr></tr>
        </tbody>
        <tbody>
            <tr></tr>
            <tr></tr>
            <tr></tr>
            <tr></tr>
        </tbody>        
    </table>
</div>

Why isn't it outputting the name of the user in a tr inside the table? And why are there two tbody being produced?

Answer 1

You should put the content in <td> elements.

<tr>
    <td>myHeader</td>
</tr>

and

echo "<tr>\n<td>";
echo $row->name;
echo "</td>\n</tr>";

Edit: and the browser does rearrange the bad content outside of any tr in the DOM, that's right, because it doesn't know what to do with the content otherwise. However, I wouldn't know why there are two tbody elements being created. No clue how that could happen.

Answer 2

I think this will work for you :-

myHeader

    <?php
        if(isset($records)){
            foreach($records as $row){
                echo "<tr><td>";
                echo $row->name;
                echo "</td></tr>";
            }
        }   
    ?>
</table>

Answer 3

Change:

foreach($records as $row){
    echo "<tr><td>";
    echo $row->name;
    echo "</td></tr>";
}