Thursday, 1 September 2016

Table Sorting with jQuery Grid using PHP and MySQL


Click here to Download



<div class="example ex-1">
<th>Date of Birth</th>
<th class="number">Age</th>
<th class="no-sort">Photo</th>
<td>Libero Ram</td>
<td>Software Developer</td>
<td data-sort-value="2">Aug 15, 1991</td>
<td><img src="" width="50"></td>
<td>Ram Kumar</td>
<td data-sort-value="4">may 01, 1992</td>
<th><img src="" width="50"></td>
<td>Php Developer</td>
<td data-sort-value="1">June 18, 1942</td>
<td><img src="" width="50"></td>
<td data-sort-value="3">July 26, 1974</td>
<td><img src="" width="50"></td>

Java Script

<script   src=""></script>
<script src="jquery.tablesort.min.js"></ script>
<script type="text/javascript">

$(function() {

$('thead th.number').data('sortBy', function(th, td, sorter) {
return parseInt(td.text(), 10);



<style type="text/css">
body {
font: normal 14px/21px Arial, serif;
.example {
float: left;
width: 40%;
margin: 5%;
table {
font-size: 1em;
border-collapse: collapse;
margin: 0 auto;
table, th, td {
border: 1px solid #999;
padding: 8px 16px;
text-align: left;

th {
background: #f4f4f4;
cursor: pointer;

th.sorted {
background: #d4d4d4;
}, {
background: #f4f4f4;
cursor: not-allowed;

th.sorted.ascending:after {
content: "  \2191";

th.sorted.descending:after {
content: " \2193";

.disabled {
opacity: 0.5;

Click here to Download

No comments:

Post a Comment