[XSL-LIST Mailing List Archive Home] [By Thread] [By Date] [Recent Entries] [Reply To This Message]

alternate colors for table example - how does it work?

Subject: alternate colors for table example - how does it work?
From: "dmitrik@xxxxxxxxxxxxxx" <dmitrik@xxxxxxxxxxxxxx>
Date: Tue, 17 Jun 2003 13:35:37 -0400
css table alternate colors
how can this example work with my code (bottom of page)?

where does this code:

 <xsl:template match="ROW">
      <tr class="r{position() mod 2}">
        <xsl:apply-templates/>
      </tr>
    </xsl:template>
 fit with my code at the bottom of the page?
I tried a few things, but nothing seems to work.
My <style> in the page is only called, when directly in the
page, not when using link.

how is this 

# My CSS File named "Something.css"
    .r0 {background-color: #f9f9f9}
    .r1 {background-color: #f7f7e7}


supposed to be called?

tia,
dk

----EXAMPLE ----------------------------------

 Alternate colors on TABLE rows
 
 Steve Muench

| Does anyone have any tips for adding a background color to every
*alternate*
| TABLE row in the result tree?

There are lots of ways to do this, but the one I've settled on in the
XSLT-driven database apps I build is the following: 

(1) I create a CSS Stylesheet containing two CSS classes like "row0" and
"row1" as follows (I shorten to "r0" and "r1"):

    # My CSS File named "Something.css"
    .r0 {background-color: #f9f9f9}
    .r1 {background-color: #f7f7e7}

(2) I create an XSLT stylesheet that creates an HTML page that links to
this Something.css stylesheet:

<!-- Root template of my stylesheet -->
    <xsl:template match="/">
      <html>
        <head>
           <title>Cool XSLT App</title>
           <link rel="stylesheet" type="text/css" href="Something.css"/>
        </head>
        <body><xsl:apply-templates/></body>
      </html>
    </xsl:template>

(3) In my template that is creating HTML table rows, I use an attribute
value template to alternate the *name* of the CSS class in use for that row
to "toggle" between the names "r0" for even rows and "r1" for odd rows...

    <!-- Match a row of database query query results in XML -->
    <xsl:template match="ROW">
      <tr class="r{position() mod 2}">
        <xsl:apply-templates/>
      </tr>
    </xsl:template>

The expression {position() mod 2} will alternate between the values 1 and 0
so the effective value of the "class" attribute on the <tr> element I'm
creating is "r1" and "r0".

This way, I can control the fonts/colors of my entire site by touching a
single CSS file, while XSLT takes care of all the fancy stuff.
 
====================================END OF EXAMPLE
my code:

<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">


 <xsl:template match="/">
      <html>
        
      
 <style>
   td { width: 250px } 
   
    	
   </style>

<?xml-stylesheet href="something.css" type="text/css"?>
        
        <body>
   

   <!--<?xml-stylesheet href="something.css" type="text/css"?>-->


   
    <table border="1">
     <tr>
      <td>Trade #</td>
      <td>Buy/Sell</td>
      <td>Counterparty</td>
      <td>Borrower</td>
      <td>Method</td>
      <td>Trade Date</td>
      <td>Trade Close Date</td>
      <td>Facilities (Name,Amount,Price,Currency)</td> 
      <td width="10%">Trade Documents                     </td>     
      <td>Funds (Trade#, Name,Facilities (Name,Amount,Price,Currency),
Documents)</td>                      
     </tr>    
     <xsl:for-each select="trades/trade">
       <xsl:sort select="trade" order="ascending"/>	
      <tr class="r{position() mod 2}">
       <td> 
         <xsl:value-of select="par"/>
       </td>
       <td>
        <xsl:value-of select="buysell"/>
       </td>
       <td>
        <xsl:value-of select="counterparty"/>
       </td>
       <td>
        <xsl:value-of select="borrower"/>
       </td>
       <td>
        <xsl:value-of select="method"/>
       </td>
       <td>
        <xsl:value-of select="tradedate"/>
       </td>
       <td>
        <xsl:value-of select="tradeclosedate"/>
       </td>
       <td>
        <xsl:for-each select="facilities">
         <table border="1">
          <tr>
           <td>
            <xsl:value-of select="name"/>
           </td>
           <td>
            <xsl:value-of select="amount"/>
           </td>
           <td>
            <xsl:value-of select="price"/>
           </td>
	   <td>
            <xsl:value-of select="currency"/>
           </td>
          </tr>
         </table>
        </xsl:for-each>
       </td>
       <td>
        <xsl:for-each select="repdocuments">
         <table >
          <tr>           
           <td>               
            <a href="{docpath}" target="_blank">	<xsl:value-of
select="docdescrip"/> </a>	
           </td>           
          </tr>
         </table>
        </xsl:for-each>
       </td>  	  
       <td>
        <xsl:for-each select="funds">	 
         <table border="1">
          <tr>           
	 
           <td>               
             <xsl:value-of select="fundpar"/>
           </td>  
           <td>               
             <xsl:value-of select="fundname"/>
           </td>  
	   <td>
            <xsl:for-each select="fundfacilities">
             <table border="1">
              <tr>
               <td>
                <xsl:value-of select="name"/>
               	 </td>
                  <td>
                   <xsl:value-of select="amount"/>
                    </td>
                     <td>
                   <xsl:value-of select="price"/>
                  </td>
	        <td>
              <xsl:value-of select="currency"/>
             </td>
           </tr>
         </table>
        </xsl:for-each>
       </td>
           <td>
			 <xsl:for-each select="funddocuments">
			  <table border="1">
			   <tr>           
			    <td>               
			     <a href="{docpath}" target="_blank">	<xsl:value-of
select="docdescrip"/> </a>	
			    </td>           
			   </tr>
			  </table>
			 </xsl:for-each>
			</td>                            
          </tr>
         </table>
        </xsl:for-each>
       </td>           
      </tr>
     </xsl:for-each>     

    </table>
   <xsl:apply-templates/>
   </body>
  </html>
 
 </xsl:template>
</xsl:stylesheet>



--------------------------------------------------------------------
mail2web - Check your email from the web at
http://mail2web.com/ .



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


Current Thread

PURCHASE STYLUS STUDIO ONLINE TODAY!

Purchasing Stylus Studio from our online shop is Easy, Secure and Value Priced!

Buy Stylus Studio Now

Download The World's Best XML IDE!

Accelerate XML development with our award-winning XML IDE - Download a free trial today!

Don't miss another message! Subscribe to this list today.
Email
First Name
Last Name
Company
Subscribe in XML format
RSS 2.0
Atom 0.3
Site Map | Privacy Policy | Terms of Use | Trademarks
Free Stylus Studio XML Training:
W3C Member
Stylus Studio® and DataDirect XQuery ™are products from DataDirect Technologies, is a registered trademark of Progress Software Corporation, in the U.S. and other countries. © 2004-2013 All Rights Reserved.