[xsl] Sorting with Javascript.

Subject: [xsl] Sorting with Javascript.
From: saurabh lakhia <slakhia@xxxxxxxxxxx>
Date: Mon, 07 Apr 2003 09:35:48 -0400
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


Current Thread