DevX Home    Today's Headlines   Articles Archive   Tip Bank   Forums   

Results 1 to 5 of 5

Thread: Alter GBColor

  1. #1
    Yas Guest

    Alter GBColor


    How do I go about altering BGColor on every other row using Data island data
    Source?

    Is it possible to do so?

    ex.
    Below, I got three Store data, I would like to show 1st and 3rd store with
    different background color

    <HTML>
    <Head></Head>
    <BODY>

    <<XML ID="xmlStoreInfo">
    <StoreInfo>
    <Store>
    <Store_Number>1</Store_Number>
    <Address>1 E. 1st ST.</Address>
    </Store>
    <Store>
    <Store_Number>2</Store_Number>
    <Address>2 E. 2nd ST.</Address>
    </Store>
    <Store>
    <Store_Number>3</Store_Number>
    <Address>3 E. 3rd ST.</Address>
    </Store>
    </StoreInfo>
    </XML>

    <Table ID="ShowStore" Datasrce="#xmlStoreInfo">
    <THEAD>
    <TR>
    <TD>Store Number</TD>
    <TD>Address</TD>
    </TR>
    </THEAD>
    <TBODY>
    <TR>
    <TD datafld="Store_number">
    <Div ID="BodyCol1" dataFld="Store_Number"></Div>
    </TD>
    <TD>
    <Div ID="BodyCol1" dataFld="Address"></Div>
    </TD>
    </TR>
    </TBODY>
    </Table>
    </BODY>
    </HTML>

  2. #2
    Russell Jones Guest

    Re: Alter GBColor

    Using the DOM, you can select the store elements and cycle through them
    concatenating the HTML and changing the background color for every odd or
    even store. Similarly, in an XSLT template, use an <xsl:if> statement to
    check whether the position() property of a store element is even or odd and
    assign the background color based on the result. Here's an XSLT template
    that illustrates the concept.

    <?xml version="1.0"?>
    <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    version="1.0">
    <xslutput method="html"/>
    <xsl:template match="/">
    <table border="1" width="50%" align="center">
    <tr><th>Store #</th><th>Address</th></tr>
    <xsl:apply-templates select="//Store"/>
    </table>
    </xsl:template>

    <xsl:template match="Store">
    <xsl:choose>
    <xsl:when test="position() mod 2 = 1">
    <tr bgcolor="#C0C0C0">
    <td><xsl:value-of select="Store_Number"/></td>
    <td><xsl:value-of select="Address"/></td>
    </tr>
    </xsl:when>
    <xsltherwise>
    <tr bgcolor="#FF00FF">
    <td><xsl:value-of select="Store_Number"/></td>
    <td><xsl:value-of select="Address"/></td>
    </tr>
    </xsltherwise>
    </xsl:choose>
    </xsl:template>
    </xsl:stylesheet>

    Russell Jones
    Sr. Web Development Editor
    DevX.com



    "Yas" <yas@quiktrip.com> wrote in message news:3a5248b8$1@news.devx.com...
    >
    > How do I go about altering BGColor on every other row using Data island

    data
    > Source?
    >
    > Is it possible to do so?
    >
    > ex.
    > Below, I got three Store data, I would like to show 1st and 3rd store with
    > different background color
    >
    > <HTML>
    > <Head></Head>
    > <BODY>
    >
    > <<XML ID="xmlStoreInfo">
    > <StoreInfo>
    > <Store>
    > <Store_Number>1</Store_Number>
    > <Address>1 E. 1st ST.</Address>
    > </Store>
    > <Store>
    > <Store_Number>2</Store_Number>
    > <Address>2 E. 2nd ST.</Address>
    > </Store>
    > <Store>
    > <Store_Number>3</Store_Number>
    > <Address>3 E. 3rd ST.</Address>
    > </Store>
    > </StoreInfo>
    > </XML>
    >
    > <Table ID="ShowStore" Datasrce="#xmlStoreInfo">
    > <THEAD>
    > <TR>
    > <TD>Store Number</TD>
    > <TD>Address</TD>
    > </TR>
    > </THEAD>
    > <TBODY>
    > <TR>
    > <TD datafld="Store_number">
    > <Div ID="BodyCol1" dataFld="Store_Number"></Div>
    > </TD>
    > <TD>
    > <Div ID="BodyCol1" dataFld="Address"></Div>
    > </TD>
    > </TR>
    > </TBODY>
    > </Table>
    > </BODY>
    > </HTML>




  3. #3
    Jon Wojtowicz Guest

    Re: Alter GBColor


    If you are using a Data Island, then you'll probably have to use DOM methods
    to build an HTML string and insert it.

    My experience with XML in IE5 and 5.5 is if you use the "http://www.w3.org/1999/XSL/Transform"
    namespace for your XSL, IE will choke on it. This is due to Microsoft shipping
    an early non-standard parser with IE.

    Another approach the I found which works with IE5 is using an XSL stylesheet
    with embedded script using the eval function as follows to generate the HTML:

    <xsl:stylesheet xmlns:xsl="http://www.w3.org/TR/WD-xsl">
    <xsl:script xmlns:xsl="http://www.w3.org/TR/WD-xsl">
    <![CDATA[
    var bColorRow = false;
    function setColor()
    {
    bColorRow = !bColorRow;
    if (bColorRow)
    return "#FFFFFF";
    else
    return "#CCFFCC";
    }
    ]]>
    </xsl:script>

    <xsl:template match="/">
    <TABLE border="1">
    <TR><TH>Store #</th><th>Address</TH></TR>
    <xsl:apply-templates select="//Store />
    </TABLE>
    </xsl:template>

    <xsl:template match="Store" >
    <TR VALIGN="top">
    <xsl:attribute name="bgcolor">
    <xsl:eval>setColor()</xsl:eval></xsl:attribute>
    <TD><xsl:value-of select="Store_Number" /></TD>
    <TD><xsl:value-of select="Address" /></TD>
    </TR>
    </xsl:template>
    </xsl:stylesheet>

    Jon Wojtowicz
    Sr. Consultant
    Solutech Inc.

    "Russell Jones" <arj1@northstate.net> wrote:
    >Using the DOM, you can select the store elements and cycle through them
    >concatenating the HTML and changing the background color for every odd or
    >even store. Similarly, in an XSLT template, use an <xsl:if> statement to
    >check whether the position() property of a store element is even or odd

    and
    >assign the background color based on the result. Here's an XSLT template
    >that illustrates the concept.
    >
    ><?xml version="1.0"?>
    ><xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    >version="1.0">
    ><xslutput method="html"/>
    > <xsl:template match="/">
    > <table border="1" width="50%" align="center">
    > <tr><th>Store #</th><th>Address</th></tr>
    > <xsl:apply-templates select="//Store"/>
    > </table>
    > </xsl:template>
    >
    > <xsl:template match="Store">
    > <xsl:choose>
    > <xsl:when test="position() mod 2 = 1">
    > <tr bgcolor="#C0C0C0">
    > <td><xsl:value-of select="Store_Number"/></td>
    > <td><xsl:value-of select="Address"/></td>
    > </tr>
    > </xsl:when>
    > <xsltherwise>
    > <tr bgcolor="#FF00FF">
    > <td><xsl:value-of select="Store_Number"/></td>
    > <td><xsl:value-of select="Address"/></td>
    > </tr>
    > </xsltherwise>
    > </xsl:choose>
    > </xsl:template>
    ></xsl:stylesheet>
    >
    >Russell Jones
    >Sr. Web Development Editor
    >DevX.com
    >
    >
    >
    >"Yas" <yas@quiktrip.com> wrote in message news:3a5248b8$1@news.devx.com...
    >>
    >> How do I go about altering BGColor on every other row using Data island

    >data
    >> Source?
    >>
    >> Is it possible to do so?
    >>
    >> ex.
    >> Below, I got three Store data, I would like to show 1st and 3rd store

    with
    >> different background color
    >>
    >> <HTML>
    >> <Head></Head>
    >> <BODY>
    >>
    >> <<XML ID="xmlStoreInfo">
    >> <StoreInfo>
    >> <Store>
    >> <Store_Number>1</Store_Number>
    >> <Address>1 E. 1st ST.</Address>
    >> </Store>
    >> <Store>
    >> <Store_Number>2</Store_Number>
    >> <Address>2 E. 2nd ST.</Address>
    >> </Store>
    >> <Store>
    >> <Store_Number>3</Store_Number>
    >> <Address>3 E. 3rd ST.</Address>
    >> </Store>
    >> </StoreInfo>
    >> </XML>
    >>
    >> <Table ID="ShowStore" Datasrce="#xmlStoreInfo">
    >> <THEAD>
    >> <TR>
    >> <TD>Store Number</TD>
    >> <TD>Address</TD>
    >> </TR>
    >> </THEAD>
    >> <TBODY>
    >> <TR>
    >> <TD datafld="Store_number">
    >> <Div ID="BodyCol1" dataFld="Store_Number"></Div>
    >> </TD>
    >> <TD>
    >> <Div ID="BodyCol1" dataFld="Address"></Div>
    >> </TD>
    >> </TR>
    >> </TBODY>
    >> </Table>
    >> </BODY>
    >> </HTML>

    >
    >



  4. #4
    Larry Finlay Guest

    Re: Alter GBColor


    I usually put a little script in the HEAD element of the HTML doc that goes
    like this:

    <script language="javascript">
    function body_onload(){
    for (var i = 1; i < tblShowStore.rows.length; i++)
    tblShowStore.rows(i).bgColor = (i % 2) ? "yellow" : "orange";
    }
    window.onload = body_onload;
    </script>

    Note that I start the counter at 1 to account for your header row. I have
    tried accessing the rows of the TBODY element directly, but they don't seem
    to account for the new rows created by the databinding.

    Hope this helps,

    Larry Finlay
    Sr. Software Engineer
    Advisor Technology Services

    "Yas" <yas@quiktrip.com> wrote:
    >
    >How do I go about altering BGColor on every other row using Data island

    data
    >Source?
    >
    >Is it possible to do so?
    >
    >ex.
    >Below, I got three Store data, I would like to show 1st and 3rd store with
    >different background color
    >
    ><HTML>
    ><Head></Head>
    ><BODY>
    >
    ><<XML ID="xmlStoreInfo">
    ><StoreInfo>
    > <Store>
    > <Store_Number>1</Store_Number>
    > <Address>1 E. 1st ST.</Address>
    > </Store>
    > <Store>
    > <Store_Number>2</Store_Number>
    > <Address>2 E. 2nd ST.</Address>
    > </Store>
    > <Store>
    > <Store_Number>3</Store_Number>
    > <Address>3 E. 3rd ST.</Address>
    > </Store>
    ></StoreInfo>
    ></XML>
    >
    ><Table ID="ShowStore" Datasrce="#xmlStoreInfo">
    ><THEAD>
    ><TR>
    ><TD>Store Number</TD>
    ><TD>Address</TD>
    ></TR>
    ></THEAD>
    ><TBODY>
    ><TR>
    ><TD datafld="Store_number">
    ><Div ID="BodyCol1" dataFld="Store_Number"></Div>
    ></TD>
    ><TD>
    ><Div ID="BodyCol1" dataFld="Address"></Div>
    ></TD>
    ></TR>
    ></TBODY>
    ></Table>
    ></BODY>
    ></HTML>



  5. #5
    Russell Jones Guest

    Re: Alter GBColor

    Jon's right about IE and XSLT. IE ships with the older (2.0) version of
    msxml, which was released before the W3C XSLT specification was ready and
    therefore uses the older XSL transformation namespace. However, IE5 works
    fine with the newest release of the msxml parser if you install it in
    "replace" mode. That said, for clients that are incapable of performing XSLT
    transforms, perform the transform on the server and send just the HTML.

    Russell Jones
    Sr. Web Development Editor
    DevX.com

    "Jon Wojtowicz" <jwojtowicz@solutechinc.com> wrote in message
    news:3a55bbaf$1@news.devx.com...
    >
    > If you are using a Data Island, then you'll probably have to use DOM

    methods
    > to build an HTML string and insert it.
    >
    > My experience with XML in IE5 and 5.5 is if you use the

    "http://www.w3.org/1999/XSL/Transform"
    > namespace for your XSL, IE will choke on it. This is due to Microsoft

    shipping
    > an early non-standard parser with IE.
    >
    > Another approach the I found which works with IE5 is using an XSL

    stylesheet
    > with embedded script using the eval function as follows to generate the

    HTML:
    >
    > <xsl:stylesheet xmlns:xsl="http://www.w3.org/TR/WD-xsl">
    > <xsl:script xmlns:xsl="http://www.w3.org/TR/WD-xsl">
    > <![CDATA[
    > var bColorRow = false;
    > function setColor()
    > {
    > bColorRow = !bColorRow;
    > if (bColorRow)
    > return "#FFFFFF";
    > else
    > return "#CCFFCC";
    > }
    > ]]>
    > </xsl:script>
    >
    > <xsl:template match="/">
    > <TABLE border="1">
    > <TR><TH>Store #</th><th>Address</TH></TR>
    > <xsl:apply-templates select="//Store />
    > </TABLE>
    > </xsl:template>
    >
    > <xsl:template match="Store" >
    > <TR VALIGN="top">
    > <xsl:attribute name="bgcolor">
    > <xsl:eval>setColor()</xsl:eval></xsl:attribute>
    > <TD><xsl:value-of select="Store_Number" /></TD>
    > <TD><xsl:value-of select="Address" /></TD>
    > </TR>
    > </xsl:template>
    > </xsl:stylesheet>
    >
    > Jon Wojtowicz
    > Sr. Consultant
    > Solutech Inc.
    >
    > "Russell Jones" <arj1@northstate.net> wrote:
    > >Using the DOM, you can select the store elements and cycle through them
    > >concatenating the HTML and changing the background color for every odd or
    > >even store. Similarly, in an XSLT template, use an <xsl:if> statement to
    > >check whether the position() property of a store element is even or odd

    > and
    > >assign the background color based on the result. Here's an XSLT template
    > >that illustrates the concept.
    > >
    > ><?xml version="1.0"?>
    > ><xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    > >version="1.0">
    > ><xslutput method="html"/>
    > > <xsl:template match="/">
    > > <table border="1" width="50%" align="center">
    > > <tr><th>Store #</th><th>Address</th></tr>
    > > <xsl:apply-templates select="//Store"/>
    > > </table>
    > > </xsl:template>
    > >
    > > <xsl:template match="Store">
    > > <xsl:choose>
    > > <xsl:when test="position() mod 2 = 1">
    > > <tr bgcolor="#C0C0C0">
    > > <td><xsl:value-of select="Store_Number"/></td>
    > > <td><xsl:value-of select="Address"/></td>
    > > </tr>
    > > </xsl:when>
    > > <xsltherwise>
    > > <tr bgcolor="#FF00FF">
    > > <td><xsl:value-of select="Store_Number"/></td>
    > > <td><xsl:value-of select="Address"/></td>
    > > </tr>
    > > </xsltherwise>
    > > </xsl:choose>
    > > </xsl:template>
    > ></xsl:stylesheet>
    > >
    > >Russell Jones
    > >Sr. Web Development Editor
    > >DevX.com
    > >
    > >
    > >
    > >"Yas" <yas@quiktrip.com> wrote in message

    news:3a5248b8$1@news.devx.com...
    > >>
    > >> How do I go about altering BGColor on every other row using Data island

    > >data
    > >> Source?
    > >>
    > >> Is it possible to do so?
    > >>
    > >> ex.
    > >> Below, I got three Store data, I would like to show 1st and 3rd store

    > with
    > >> different background color
    > >>
    > >> <HTML>
    > >> <Head></Head>
    > >> <BODY>
    > >>
    > >> <<XML ID="xmlStoreInfo">
    > >> <StoreInfo>
    > >> <Store>
    > >> <Store_Number>1</Store_Number>
    > >> <Address>1 E. 1st ST.</Address>
    > >> </Store>
    > >> <Store>
    > >> <Store_Number>2</Store_Number>
    > >> <Address>2 E. 2nd ST.</Address>
    > >> </Store>
    > >> <Store>
    > >> <Store_Number>3</Store_Number>
    > >> <Address>3 E. 3rd ST.</Address>
    > >> </Store>
    > >> </StoreInfo>
    > >> </XML>
    > >>
    > >> <Table ID="ShowStore" Datasrce="#xmlStoreInfo">
    > >> <THEAD>
    > >> <TR>
    > >> <TD>Store Number</TD>
    > >> <TD>Address</TD>
    > >> </TR>
    > >> </THEAD>
    > >> <TBODY>
    > >> <TR>
    > >> <TD datafld="Store_number">
    > >> <Div ID="BodyCol1" dataFld="Store_Number"></Div>
    > >> </TD>
    > >> <TD>
    > >> <Div ID="BodyCol1" dataFld="Address"></Div>
    > >> </TD>
    > >> </TR>
    > >> </TBODY>
    > >> </Table>
    > >> </BODY>
    > >> </HTML>

    > >
    > >

    >




Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center
 
 
FAQ
Latest Articles
Java
.NET
XML
Database
Enterprise
Questions? Contact us.
C++
Web Development
Wireless
Latest Tips
Open Source


   Development Centers

   -- Android Development Center
   -- Cloud Development Project Center
   -- HTML5 Development Center
   -- Windows Mobile Development Center