RE: [xsl] Sorting with Javascript.

Subject: RE: [xsl] Sorting with Javascript.
From: "Michael Kay" <mhk@xxxxxxxxx>
Date: Mon, 7 Apr 2003 19:44:21 +0100
Your problem is an HTML/Javascript problem and not an XSLT problem, so
you may be disappointed.

I'm amazed by the idea of writing your own sort routine to tackle this
problem. I don't know enough Javascript to suggest a better way,
however. Many people achieve this effect by using client-side
stylesheets.

Michael Kay
Software AG
home: Michael.H.Kay@xxxxxxxxxxxx
work: Michael.Kay@xxxxxxxxxxxxxx 

> -----Original Message-----
> From: owner-xsl-list@xxxxxxxxxxxxxxxxxxxxxx 
> [mailto:owner-xsl-list@xxxxxxxxxxxxxxxxxxxxxx] On Behalf Of 
> saurabh lakhia
> Sent: 07 April 2003 14:36
> To: xsl-list@xxxxxxxxxxxxxxxxxxxxxx
> Subject: [xsl] Sorting with Javascript.
> 
> 
> Hi All,
> 
> This is my first post. I hope you all won't disappoint me.
> 
> I have XSL file and I am displaying on a browser alongwith 
> XML file via 
> ASP. In produced HTML table on the browser I have sorting function in 
> Javascript which allows me to click on header of the table 
> and sorting 
> ascending and descending. But Unfortunatly when I call this 
> function by 
> clicking on table header column , It's changing my whole 
> Style Sheet of 
> a table and put it back on the browser in very different style. Is 
> there anyone look at my function and tells me how do I get my 
> original 
> Style Sheet results.
> -------- JavaScript Function ------------------
> 
> <script>
> <xsl:comment><![CDATA[
> 
> /*------------------------------------------------------------
> ----------
> ------
> 
>     f_sort: Performs a client side sort of the contents of a 
> HTML Table.
> 
>     args:   ao_table, The object reference to the table to be sorted.
>             ai_sortcol, The zero based column number to be sorted.
>             ab_header, Bool to indicate if the table have a header
>                 row to be ignored.
>     vars:   lastcol, used to store the last column sorted.
>             lastseq, used to store the sequence the last column was 
> sorted by.
> --------------------------------------------------------------
> ----------
> ----*/
> var lastcol, lastseq;
> function f_sort( ao_table, ai_sortcol, ab_header )
> {
>     var ir, ic, is, ii, id;
> 
>     ir = ao_table.rows.length;
>     if( ir < 1 ) return;
> 
>     ic = ao_table.rows[1].cells.length;
>     // if we have a header row, ignore the first row
>     if( ab_header == true ) is=1; else is=0;
> 
>     // take a copy of the data to shuffle in memory
>     var row_data = new Array( ir );
>     ii=0;
>     for( i=is; i < ir; i++ )
>     {
>         var col_data = new Array( ic );
>         for( j=0; j < ic; j++ )
>         {
>             col_data[j] = ao_table.rows[i].cells[j].innerText;
>         }
>         row_data[ ii++ ] = col_data;
>     }
> 
>     // sort the data
>     var bswap = false;
>     var row1, row2;
>     
>     if( ai_sortcol != lastcol )
>         lastseq = 'A';
>     else
>     {
>         if( lastseq == 'A' ) lastseq = 'D'; else lastseq = 'A';
>     }
> 
>     // if we have a header row we have one less row to sort
>     if( ab_header == true ) id=ir-1; else id=ir;
>     for( i=0; i < id; i++ )
>     {
>         bswap = false;
>         for( j=0; j < id - 1; j++ )
>         {
>             // test the current value + the next and
>             // swap if required.
>             row1 = row_data[j];
>             row2 = row_data[j+1];
>             if( lastseq == "A" )
>             {
>                 if( row1[ ai_sortcol ] > row2[ ai_sortcol ] )
>                 {
>                     row_data[j+1] = row1;
>                     row_data[j] = row2;
>                     bswap=true;
>                 }
>             }
>             else
>             {
>                 if( row1[ ai_sortcol ] < row2[ ai_sortcol ] )
>                 {
>                     row_data[j+1] = row1;
>                     row_data[j] = row2;
>                     bswap=true;
>                 }
>             }
>         }
>         if( bswap == false ) break;
>     }
> 
>     // load the data back into the table
>     ii = is;
>      
>     for( i=0; i < id; i++ )
>     {
>        
>        
>         row1 = row_data[ i ];
> 		 
>         for( j=0; j < ic; j++ )
>         {
>             ao_table.rows[ii].cells[j].innerText = row1[j];
>             alert(row1[j]);
>         }
>          
>         ii++;
>    
>     }
>    lastcol = ai_sortcol;
>  }
> ]]></xsl:comment>
> </script>
> Above function just takes the data from Table and Sorts them 
> and Put it 
> back into table. 
> 
> 
>  XSL-List info and archive:  http://www.mulberrytech.com/xsl/xsl-list
> 


 XSL-List info and archive:  http://www.mulberrytech.com/xsl/xsl-list


Current Thread