How to Sort Data in Column (Ascending and Descending) in PHP/MySQL

Submitted by alpha_luna on Friday, June 24, 2016 - 13:18.

In this simple tutorial, we are going to learn on how to Sort Data in Column (Ascending and Descending) in PHP/MySQL. The user can learn on how to create a simple source code query in MySQL that can sort data by ascending to descending order.

Creating Database and Inserting Data

Our Database

CREATE TABLE `member` (
  `member_id` INT(11) NOT NULL,
  `firstname` VARCHAR(100) NOT NULL,
  `lastname` VARCHAR(100) NOT NULL,
  `middlename` VARCHAR(100) NOT NULL,
  `address` VARCHAR(100) NOT NULL,
  `email` VARCHAR(100) NOT NULL
) ENGINE=MyISAM DEFAULT CHARSET=latin1;

Example Data

INSERT INTO `member` (`member_id`, `firstname`, `lastname`, `middlename`, `address`, `email`) VALUES
(1, 'John', 'Meyer', 'Doe', 'United States', '[email protected]'),
(2, 'Jane', 'Doe', 'Meyer', 'United States', '[email protected]'),
(3, 'Andrea', 'Meyer', 'Doe', 'Mexico', '[email protected]'),
(4, 'Rocky', 'Dew', 'Doe', 'Mexico', '[email protected]');

Default Sorting Data

This sorting is default order as you can see in the image below. Result

Here's the default source code query.

<div class="container">
<br />
<br />
<div class="pull-right">
<label style="font-weight:bold; color:blue; font-family:cursive; font-size:18px;">Order by:</label>
<a class="btn" href="ascending.php">Ascending</a>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<a class="btn" href="decending.php">Descending</a>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<a class="btn btn-info" href="index.php">Default</a>
</div>
<br />
<br />
<br />
<br />
<table class="table table-bordered">
        <thead>
                <tr>
                        <th style="text-align:center; font-family:cursive; font-size:18px; color:blue;">FirstName</th>
                        <th style="text-align:center; font-family:cursive; font-size:18px; color:blue;">LastName</th>
                        <th style="text-align:center; font-family:cursive; font-size:18px; color:blue;">MiddleName</th>
                        <th style="text-align:center; font-family:cursive; font-size:18px; color:blue;">Address</th>
                        <th style="text-align:center; font-family:cursive; font-size:18px; color:blue;">Email</th>
                </tr>
        </thead>
        <tbody>
                <?php 
                $query=mysql_query("select * from member")or die(mysql_error());
                while($row=mysql_fetch_array($query)){
                $id=$row['member_id'];
                ?>
                <tr>
                        <td style="text-align:center; font-family:cursive; font-size:18px;"><?php echo $row['firstname'] ?></td>
                        <td style="text-align:center; font-family:cursive; font-size:18px;"><?php echo $row['lastname'] ?></td>
                        <td style="text-align:center; font-family:cursive; font-size:18px;"><?php echo $row['middlename'] ?></td>
                        <td style="text-align:center; font-family:cursive; font-size:18px;"><?php echo $row['address'] ?></td>
                        <td style="text-align:center; font-family:cursive; font-size:18px;"><?php echo $row['email'] ?></td>
                </tr>
                <?php } ?>
        </tbody>
</table>
</div>

Ascending Sorting Data

This sorting is ascending order as you can see in the image below. Result

Here's the ascending source code query.

<div class="container">
<br />
<br />
<div class="pull-right">
<label style="font-weight:bold; color:blue; font-family:cursive; font-size:18px;">Order by:</label>
<a class="btn btn-info" href="ascending.php">Ascending</a>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<a class="btn btn-default" href="decending.php">Descending</a>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<a class="btn btn-default" href="index.php">Default</a>
</div>
<br />
<br />
<br />
<br />
<table  class="table table-striped table-bordered">
        <thead>
                <tr>
                        <th style="text-align:center; font-family:cursive; font-size:18px; color:blue;">FirstName</th>
                        <th style="text-align:center; font-family:cursive; font-size:18px; color:blue;">LastName</th>
                        <th style="text-align:center; font-family:cursive; font-size:18px; color:blue;">MiddleName</th>
                        <th style="text-align:center; font-family:cursive; font-size:18px; color:blue;">Address</th>
                        <th style="text-align:center; font-family:cursive; font-size:18px; color:blue;">Email</th>
                </tr>
        </thead>
        <tbody>
                <?php 
                $query=mysql_query("select * from member order by firstname ASC")or die(mysql_error());
                while($row=mysql_fetch_array($query)){
                $id=$row['member_id'];
                ?>                              
                <tr>                                                                    
                        <td style="text-align:center; font-family:cursive; font-size:18px;"><?php echo $row['firstname'] ?></td>
                        <td style="text-align:center; font-family:cursive; font-size:18px;"><?php echo $row['lastname'] ?></td>
                        <td style="text-align:center; font-family:cursive; font-size:18px;"><?php echo $row['middlename'] ?></td>
                        <td style="text-align:center; font-family:cursive; font-size:18px;"><?php echo $row['address'] ?></td>
                        <td style="text-align:center; font-family:cursive; font-size:18px;"><?php echo $row['email'] ?></td>
                </tr>
                <?php } ?>
        </tbody>
</table>
</div>

Descending Sorting Data

This sorting is descending order as you can see in the image below. Result

Here's the descending source code query.

<div class="container">
<br />
<br />
<div class="pull-right">
<label style="font-weight:bold; color:blue; font-family:cursive; font-size:18px;">Order by:</label>
<a class="btn btn-default" href="ascending.php">Ascending</a>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<a class="btn btn-info" href="decending.php">Descending</a>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<a class="btn btn-default" href="index.php">Default</a>
</div>
<br />
<br />
<br />
<br />
<table  class="table table-striped table-bordered">
        <thead>
                <tr>
                        <th style="text-align:center; font-family:cursive; font-size:18px; color:blue;">FirstName</th>
                        <th style="text-align:center; font-family:cursive; font-size:18px; color:blue;">LastName</th>
                        <th style="text-align:center; font-family:cursive; font-size:18px; color:blue;">MiddleName</th>
                        <th style="text-align:center; font-family:cursive; font-size:18px; color:blue;">Address</th>
                        <th style="text-align:center; font-family:cursive; font-size:18px; color:blue;">Email</th>
                </tr>
        </thead>
        <tbody>
                <?php 
                $query=mysql_query("select * from member order by firstname DESC")or die(mysql_error());
                while($row=mysql_fetch_array($query)){
                $id=$row['member_id'];
                ?>                              
                <tr>                                                                    
                        <td style="text-align:center; font-family:cursive; font-size:18px;"><?php echo $row['firstname'] ?></td>
                        <td style="text-align:center; font-family:cursive; font-size:18px;"><?php echo $row['lastname'] ?></td>
                        <td style="text-align:center; font-family:cursive; font-size:18px;"><?php echo $row['middlename'] ?></td>
                        <td style="text-align:center; font-family:cursive; font-size:18px;"><?php echo $row['address'] ?></td>
                        <td style="text-align:center; font-family:cursive; font-size:18px;"><?php echo $row['email'] ?></td>
                </tr>
                <?php } ?>
        </tbody>
</table>
</div>

And, that's it. This is the steps on how to Sort Data in Column (Ascending and Descending) in PHP/MySQL. Kindly click the "Download Code" button below for full source code. Thank you very much. Hope that this tutorial will help you a lot. Share us your thoughts and comments below. Thank you so much for dropping by and reading this tutorial post. For more updates, don’t hesitate and feel free to visit this website more often and please share this with your friends or email me at [email protected]. Practice Coding. Thank you very much.

Add new comment

768 views