Choose Text Color For Outputted Html Rendered Tabular Data Through Xml With Xsl As Reference

Based on my above xsl, i just want to make sure that whenever the value for status column for my output tabular data is Running its displayed in green color, if its Stopping it ge

Solution 1:

You need to add a class to each of your rows to be styled, and then add the appropriate rules to the stylesheet.

If you wish to set the color of the entire row, change the first line of

<tr>
    <td><xsl:value-of select="@component" /></td>
    <td><xsl:value-of select="@name" /></td>
    <td><xsl:value-of select="@operation" /></td>
    <td><xsl:value-of select="@version" /></td>
    <td>
        <xsl:for-each select="instances/instance">
            <xsl:value-of select="@status"/>
            <xsl:value-of select="'&#160;'"/>
        </xsl:for-each>
    </td>
</tr>

to <tr class="{./instances/instance/@status}">. This will add the status as a class attribute to your outputted table rows.

Now you can modify the css stylesheet to

<style type="text/css">
    table {table-layout: fixed; width: 100%;}
    td {width: 20%; word-wrap: break-word;}
    tr.Running {color: green;}
    tr.Stopping {color: red;}
</style>

---

If instead of coloring the entire row, you wish just to color the status column, instead of the above, you need to change the first line of

<td>
    <xsl:for-each select="instances/instance">
        <xsl:value-of select="@status"/>
        <xsl:value-of select="'&#160;'"/>
    </xsl:for-each>
</td>

to <td class="{./instances/instance/@status}"> and modify the css stylesheet to

<style type="text/css">
    table {table-layout: fixed; width: 100%;}
    td {width: 20%; word-wrap: break-word;}
    td.Running {color: green;}
    td.Stopping {color: red;}
</style>