Data that is echoed is not in correct rows

Question

Not quite sure how to explain this but i think the picture says it all. I am trying to popular the table with data from my database.

Very lost and confused as to how i get it correct.

Thank you

Want to retain my checkbox sum function

undesired result

desired outcome

This is my code

<?php
include('connect1.php');
$retrieve = $db->prepare("SELECT count(*) FROM Asset");
    $retrieve->execute();
    $fetchrow = $retrieve->fetch(PDO::FETCH_NUM);
    $calculated=$fetchrow[0];
?>


<script type="text/javascript">

function UpdateCost() {
  var sum = 0;
  var gn, elem;
  for (i=0; i<<?php echo $calculated ?>; i++) {
    gn = 'sum_m_'+i;
    elem = document.getElementById(gn);
    if (elem.checked == true) { sum += Number(elem.value); }
  }
  document.getElementById('totalcost' ).value = sum.toFixed(0);
}
window.onload=UpdateCost

</script>

<link rel="stylesheet" href="style.css" />

Total Cost : <input type="text" name="sen" id="totalcost" value="">


<?php
include('connect1.php');
$result = $db->prepare("SELECT * FROM Asset");
        $result->bindParam(':userid', $res);
        $result->execute();
        for($i=0; $row = $result->fetch(); $i++){
    ?>




        <table cellpadding="0" cellspacing="0" border="0" id="table" class="sortable">
        <thead>

            <tr>


                <th><h3>Asset ID</h3></th>
                <th><h3>Vendor</h3></th>
                <th><h3>Hardware </h3></th>
                <th><h3>Cost</h3></th>
                <th><h3>Date Of Purchase</h3></th>
                <th><h3><INPUT TYPE="checkbox" NAME="items[]" value="<?php echo $row['Asset_Cost'] ?>" id="sum_m_<?php echo $i ?>" onclick="UpdateCost()"></h3></th>


            </tr>
        </thead>



    <?php



    echo "<tr>";

    echo "<td>" . $row['Asset_ID'] . "</td>"; 
    echo "<td>" . $row['Vendor_Name'] . "</td>"; 
    echo "<td>" . $row['Hardware_ID'] . "</td>"; 
    echo "<td>" . $row['Asset_Cost'] . "</td>"; 
    echo "<td>" . $row['DateOfPurchase'] . "</td>"; 

    echo "</tr>";





    }
?>
<br>

<div id="controls">
        <div id="perpage">
            <select onchange="sorter.size(this.value)">
            <option value="5">5</option>
                <option value="10" selected="selected">10</option>
                <option value="20">20</option>
                <option value="50">50</option>
                <option value="100">100</option>
            </select>
            <span>Entries Per Page</span>
        </div>
        <div id="navigation">
            <img src="images/first.gif" width="16" height="16" alt="First Page" onclick="sorter.move(-1,true)" />
            <img src="images/previous.gif" width="16" height="16" alt="First Page" onclick="sorter.move(-1)" />
            <img src="images/next.gif" width="16" height="16" alt="First Page" onclick="sorter.move(1)" />
            <img src="images/last.gif" width="16" height="16" alt="Last Page" onclick="sorter.move(1,true)" />
        </div>
        <div id="text">Displaying Page <span id="currentpage"></span> of <span id="pagelimit"></span></div>
    </div>

Answer 1

The table and thead tag should be outside the loop,

also i noticed that you included the connect1.php file twice :

<?php
    include('connect1.php');
    $retrieve = $db->prepare("SELECT count(*) FROM Asset");
    $retrieve->execute();
    $fetchrow = $retrieve->fetch(PDO::FETCH_NUM);
    $calculated=$fetchrow[0];
?>

<script type="text/javascript">

    function UpdateCost() {
        var sum = 0;
        var gn, elem;
        for (i=0; i<<?php echo $calculated ?>; i++) {
            gn = 'sum_m_'+i;
            elem = document.getElementById(gn);
            if (elem.checked == true) { sum += Number(elem.value); }
        }
        document.getElementById('totalcost' ).value = sum.toFixed(0);
    }
    window.onload=UpdateCost

</script>

<link rel="stylesheet" href="style.css" />

Total Cost : <input type="text" name="sen" id="totalcost" value="" />

<table cellpadding="0" cellspacing="0" border="0" id="table" class="sortable">
    <thead>
        <tr>
            <th><h3>Asset ID</h3></th>
            <th><h3>Vendor</h3></th>
            <th><h3>Hardware </h3></th>
            <th><h3>Cost</h3></th>
            <th><h3>Date Of Purchase</h3></th>
        </tr>
    </thead>
    <tbody>
        <?php
            // include('connect1.php'); you already included this file
            $result = $db->prepare("SELECT * FROM Asset");
            $result->bindParam(':userid', $res);
            $result->execute();
            for($i=0; $row = $result->fetch(); $i++){
            ?>
            <tr>
                <td><?php echo $row['Asset_ID']; ?></td>
                <td><?php echo $row['Vendor_Name']; ?></td>
                <td><?php echo $row['Hardware_ID']; ?></td>
                <td><?php echo $row['Asset_Cost']; ?></td>
                <td><?php echo $row['DateOfPurchase']; ?></td>
            </tr>
            <?php
            }
        ?>
    </tbody>
</table>
<br />

<div id="controls">
    <div id="perpage">
        <select onchange="sorter.size(this.value)">
            <option value="5">5</option>
            <option value="10" selected="selected">10</option>
            <option value="20">20</option>
            <option value="50">50</option>
            <option value="100">100</option>
        </select>
        <span>Entries Per Page</span>
        </div>
        <div id="navigation">
            <img src="images/first.gif" width="16" height="16" alt="First Page" onclick="sorter.move(-1,true)" />
            <img src="images/previous.gif" width="16" height="16" alt="First Page" onclick="sorter.move(-1)" />
            <img src="images/next.gif" width="16" height="16" alt="First Page" onclick="sorter.move(1)" />
            <img src="images/last.gif" width="16" height="16" alt="Last Page" onclick="sorter.move(1,true)" />
        </div>
        <div id="text">Displaying Page <span id="currentpage"></span> of <span id="pagelimit"></span></div>
    </div>          

Answer 2

Move your table head outside of the for loop:

This line:

    for($i=0; $row = $result->fetch(); $i++){

should go after this line:

    </thead>

You are now starting a new table and head for each row.

Also don't forget to close your table with </table>.