[jQuery] How to make td clickable for table sorting
I want to make the table header clickable and used the sample code
from Textbook Learning JQuery
I am not sure where is the class 'clickable'present.
Does anybody know how can I get this working.
I loaded the JQuery.js and its linked properly.
Works fine.
7 $(document).ready( function() {
8 $('table.sortable').each( function () {
9 var $table = $(this); /*This returns the current table
for each table */
10 $('tbody tr:odd', $table).removeClass('even').addClass
('odd');
11 $('tbody tr:even', $table).removeClass('odd').addClass
('even');
12 $('th', $table).each(function(column) {
13 if ($(this).is('sort-alpha') ) {
14 $(this).addClass('clickable').hover(function()
{
15 alert ('1iadfahdgf');
16 $(this).addClass('hover');
17 }, function() {
18 $(this).removeClass('hover');
19 }).click(function(){
20 var rows = $table.find('tbody >
tr').get();
21 rows.sort(function(a,b) {
22 var keyA = $(a).children('td').eq
(column).text().toUpperCase();
23 var keyB = $(b).children('td').eq
(column).text().toUpperCase();
24 if ( keyA > $keyB ) return -1;
25 if ( keyA < $keyB ) return 1;
26 return 0;
27 });
28 $.each(rows,function(index, row ) {
29 $table.children('tbody').append(row);
30 });
31 });
32 }
33 });
34 });
35 });
Thanks in advance, and appreciate your help.
Thanks
Anil