How to order table by column just click in the head column?

2 replies
<!DOCTYPE html>
<html>
<body>

<form action="insert.php" method="post">
Firstname:<input type="text" name="firstname"><br>
Lastname: <input type="text" name="lastname"><br>
Age: <input type="text" name="age">
<input type="submit">
</form>
<?php
$con
= mysql_connect("localhost","root","");
if (!
$con)
{
die(
'Could not connect: ' . mysql_error());
}

mysql_select_db("my_db", $con);

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

echo
"<table border='1'>
<tr>
<th>ID No.</th>
<th><form><input type='submit' name='orderbyfirstname' value='First Name'></button></form></th>
<th></th>
<th><form><input type='submit' name='orderbylastname' value='Last Name'></button></form></th>
<th></th>
<th><form><input type='submit' name='orderbyage' value='Age'></button></form></th>
<th></th>
</tr>"
;

//Order by id
while($row = mysql_fetch_array($result))
{
echo
"<tr>";
//echo"<td>" . $row['No'] . "</td>";
echo "<td>". $row['id'] . "</td>";
echo
"<td><textarea>" . $row['FirstName'] . "</textarea></td>";

echo
"<td><p>B/S</p></td>";

echo
"<td><textarea>" . $row['LastName'] . "</textarea></td>";
echo
"<td><p>B/S</p></td>";
echo
"<td><textarea>" . $row['Age'] . "</textarea></td>";
echo
"<td><p>B/S</p></td>";
echo
"</tr>";
}

//Order by FirstName
if(isset($_POST['orderbyfirstname'])){
$OrderByFirstname = mysql_query("SELECT * FROM persons ORDER BY firstname");
while (
$row = mysql_fetch_array($result, $OrderByFirstname)) {
echo
"<tr>";
//echo"<td>" . $row['No'] . "</td>";
echo "<td>". $row['Id'] . "</td>";
echo
"<td><textarea>" . $row['FirstName'] . "</textarea></td>";

echo
"<td><p>B/S</p></td>";

echo
"<td><textarea>" . $row['LastName'] . "</textarea></td>";
echo
"<td><p>B/S</p></td>";
echo
"<td><textarea>" . $row['Age'] . "</textarea></td>";
echo
"<td><p>B/S</p></td>";
echo
"</tr>";
}
}
//Order by Lastname
if(isset($_POST['orderbylastname'])){
$OrderByLastName = mysql_query("SELECT * FROM persons ORDER BY lastname");
while (
$row = mysql_fetch_array($result,$OrderByLastName)) {
echo
"<tr>";
//echo"<td>" . $row['No'] . "</td>";
echo "<td>". $row['Id'] . "</td>";
echo
"<td><textarea>" . $row['FirstName'] . "</textarea></td>";

echo
"<td><p>B/S</p></td>";

echo
"<td><textarea>" . $row['LastName'] . "</textarea></td>";
echo
"<td><p>B/S</p></td>";
echo
"<td><textarea>" . $row['Age'] . "</textarea></td>";
echo
"<td><p>B/S</p></td>";
echo
"</tr>";
}
}
//Ordena por Age
if(isset($_POST['orderbyage'])){
$OrderByAge = mysql_query("SELECT * FROM persons ORDER BY age");
while (
$row = mysql_fetch_array($result,$OrderByAge)) {
echo
"<tr>";
//echo"<td>" . $row['No'] . "</td>";
echo "<td>". $row['Id'] . "</td>";
echo
"<td><textarea>" . $row['FirstName'] . "</textarea></td>";

echo
"<td><p>B/S</p></td>";

echo
"<td><textarea>" . $row['LastName'] . "</textarea></td>";
echo
"<td><p>B/S</p></td>";
echo
"<td><textarea>" . $row['Age'] . "</textarea></td>";
echo
"<td><p>B/S</p></td>";
echo
"</tr>";
}
}
echo
"</table>";

mysql_close($con);
?>
</body>
</html>
#click #column #head #order #table
  • Profile picture of the author Michael71
    Code:
    if(noexplanation == true){gotoFiverr();}else{changeyourpost();}
    Signature

    HTML/CSS/jQuery/ZURB Foundation/Twitter Bootstrap/Wordpress/Frontend Performance Optimizing
    ---
    Need HTML/CSS help? Skype: microcosmic - Test Your Responsive Design - InternetCookies.eu

    {{ DiscussionBoard.errors[7818257].message }}
    • Profile picture of the author Brandon Tanner
      lol @ Michael

      @ OP.... to do that requires a client-side solution (ie Javascript). Here's a jQuery plugin that accomplishes that nicely...

      jQuery plugin: Tablesorter 2.0

      There's a bunch of jQuery plugins that do this, apparently (Google "jQuery table sort"), but the one I linked to is the only one I've used for this purpose. Works great.
      Signature

      {{ DiscussionBoard.errors[7818431].message }}

Trending Topics