Sorting Data in Table
Submitted by azalea zenith on Friday, October 14, 2016 - 12:30.
In this tutorial, we are going to create Sorting Data in Table. This simple program is written using HTML and JavaScript jQuery. Using this program, users enable to bit by bit sorting numbers and letters in the existing data table on the web page. To sort data in the table, kindly click the to sort it whether ascending or descending.
Check Live Demo below:
Let's Create It
In this tutorial, we need this link to finish the program to sort data in the table. Copy and paste to the HEAD tag of your page.
and to your table.
Copy and paste this simple script below to your table. We are going to use this script for totally run the program. Therefore, the user enables to sort data in the table.
of the table is clickable to sorting data.
var methods = {
init: function() {
var $this = this;
return this.find('thead th').each(function(x) {
var th = $(this);
(function(i) {
$(th).bind('click', function() {
sortListener(i, $this);
}).css('cursor', 'pointer');
})(x);
});
},
destroy: function() {
return this.find('thead th').each(function() {
$(this).unbind();
})
}
}
Check Live Demo below:
Output
Data in the table sort as descending.
Sorting Data in Table
| Number | User Name | Encrypted Password |
|---|---|---|
| 1 | source codester | 40793a24fd71acaacf7ae534d8784fa7 |
| 2 | Jane Meyer | 9a0c75a27f67d0496095d060f28fb8ed |
| 3 | John Doe | a0482e670829269e7598d81bf28c13ac |
| 4 | John Meyer | a0482e6708292afdsdfsd81bf28c13ac |
| 5 | Augustus Caesar | a0482e67xdkjvhfsdkj234241bf28c13ac |
Add new comment
- 42 views
