Hi,

Below is a snippet of an HTML Grid that I am using to display a list
of sortable items.

<TABLE class=scroll style="BORDER-TOP: black 1px solid" cellSpacing=1
cellPadding=1 border=0>
          <TBODY>
                <TR class="ColumnHeader">
                       <TD style="WIDTH: 465px; TEXT-ALIGN:
left;">Column1</TD>
                       <TD class="noSort" style="WIDTH: 30px; TEXT-
ALIGN: center">6</TD>
                </TR>
               <TR class=ColumnContent>
                        <TD>abc</TD>
                        <TD><input type=radio  value=6
name=rd_Answer></TD>
                </TR>
                <TR class="ColumnContent">.......</TR>
          </TBODY>
</TABLE>

When the user clicks on ('.Column Header td'), I invoke the following
function:

                               function sortTable($tbl, colIndex, desc)
{

                                       //push the rows in to an array
                                       var rows = new Array();
 
$tbl.find('.ColumnContent').each(function(){
                                             rows.push($
(this).clone(true)); // This is where I am getting an error in IE.
                                       });

                                       //perform sort
                                       rows.sort(function($lhs, $rhs){
                                             var lhsVal = $lhs.find('td:eq(' + 
colIndex + ')').text();
                                             var rhsVal = $rhs.find('td:eq(' + 
colIndex + ')').text();
                                             if (lhsVal > rhsVal){
                                                    return  (bDesc) ? -1 : 1;
                                             }
                                             else if (lhsVal < rhsVal)
                                                    return (bDesc) ? 1 : -1;
                                             else
                                                    return 0;
                                        });

                                       //apply sort
                                       $tbl.find('.ColumnContent').remove();
                                       for (var i=0; i<rows.length; ++i){
                                              $tbl.append(rows[i].clone(true));
                                       }
                               }


What I am trying to do here is write a custom Grid using jquery. When
the user clicks on a ColumnHeader, I want to add all the rows in the
table to an array, including any events that might be bound to the
HTML elements. It then takes the index of the column that was clicked
and sorts the array based on a comparator that I am passing to the
sort function. Finally, I want to remove all the rows and append the
ones from the sorted array. The problem that I am having is that this
works perfectly in Firefox, but in IE, I get an error saying
"'nodeType' is null or not an object" in jquery-1.2.6.min.js.  Can
someone confirm that this is a bug in jquery and not something I am
doing incorrectly? Also, is this the best way to sort a table based on
a column? Any help is appreciated.

Thanks

--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups 
"jQuery UI" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at 
http://groups.google.com/group/jquery-ui?hl=en
-~----------~----~----~----~------~----~------~--~---

Reply via email to