[jQuery] Re: How to make td clickable for table sorting

Thanks Carl,
Yes the script is incomplete since I just started working with JQuery.

Moreover I guess I was not clear with my question.
Anyways my simple doubt was about the CSS

.clickable {
cursor:pointer;
}

I guess adding the above class will solve my problem.
But thanks for the links and your help.

This group rocks !!!!!!

-Anil

On May 1, 5:18 am, Karl Swedberg <k...@englishrules.com> wrote:
> Hi Anil,
>

> You're not seeing the entire script there, and it seems you're looking  
> at the old book.
>
> The "clickable" class is added to the header cell to give some visual  
> indication that it is clickable, and it's style in the CSS.
>
> You can find the complete script from the newer book here:
>
> http://book.learningjquery.com/6705/bookstore/scripts/tables.js
> Since the script follows along with the book chapters, you'll see a  
> lot of commented lines. We took an "iterative" approach to the  
> chapters, improving the script as we went along. The code you're  
> looking for starts around line 542.
>
> You can also see a demo here:
>
> http://book.learningjquery.com/6705/bookstore/books/index.html
>
> Hope that helps,
>
> --Karl
>
> ____________
> Karl Swedbergwww.englishrules.comwww.learningjquery.com
>
> On May 1, 2009, at 1:37 AM, Anil wrote:
>
>
>
> > This is same code as in book.
> >http://www.packtpub.com/article/jquery-table-manipulation-part1
>
> > On Apr 30, 10:35 pm, Anil <virap...@gmail.com> wrote:
> >> 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