Expand Table Row with Additional information Fetched from Database

Question

Here is a little demonstration of what I want achieved.

What I want, is a clickable row with additional information fetched from the database. I've seen some examples with Jquery, but those have some kind of static information in the expanded area. I want to load in this additional information, only after the row is clicked - so I wont have to load in too much information that might not be used.

Now, inside the expanded area, I need the additional information to be fetched like:

while($row = mysql_fetch_array($result))
{
    echo "<tr>";
    echo "<td>" . $row['manufacturer'] . "</td>";
    echo "<td>" . $row['describtion'] . "</td>";
    echo "<td>" . $row['rdate'] . "</td>";
    echo "<td>" . $row['locked'] . "</td>";
    echo "</tr>"; 
}

But only if a specific row is clicked.

<?php
     $con = mysql_connect("localhost","root","");
     if (!$con)
     {
        die('Could not connect: ' . mysql_error());
     }

     mysql_select_db("phone", $con);

     $result = mysql_query("SELECT * FROM info");

     echo "<table border='1'>
           <tr>
               <th>Model</th>
               <th>Software</th>
               <th>Carrier</th>
               <th>Price</th>
           </tr>";

     while($row = mysql_fetch_array($result))
     {
        echo "<tr>";
        echo "<td>" . $row['model'] . "</td>";
        echo "<td>" . $row['os'] . "</td>";
        echo "<td>" . $row['carrier'] . "</td>";
        echo "<td>" . $row['price'] . "</td>";
        echo "</tr>";
     }
     echo "</table>";

     mysql_close($con);
  ?>

I have really done extensive searching, but that didn't get me closer to a solution. Would it be better if I added HTML to the code, and somehow fetched the data inside the td tags?

Answer 1

I ended up using Datagrid. It has the exact functionality I was looking for, and alot of tutorials to get you started. http://www.jeasyui.com/tutorial/datagrid/datagrid21.php