How to set different colors for even odd rows in a data table

hi,
In my project i hav a data table. i am using jsf. i want the rows of the data table different colors for even, odd rows. can i do it just setting the row class property ? or there should be there some other way? please help.
sailajoy

Hope this helps
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title></title>
<style type='text/css'>
.scrollContent {
height:100px;
overflow-x:hidden;
overflow-y:auto;
.scrollContent tr {
height: auto;
white-space: nowrap;
.scrollContent tr td:last-child {
padding-right: 20px;
.fixedHeader tr {
position: relative;
height: auto;
top: expression( this.parentNode.parentNode.parentNode.scrollTop + 'px' );
div.TableContainer {
border: 1px solid #7DA87D;
.headerFormat {
background-color: white;
color: #C8D7B5;
margin: 3px;
padding: 1px;
white-space: nowrap;
font-family: Helvetica;
font-size: 16px;
text-decoration: none;
font-weight: bold;
.headerFormat tr td {
border: 1px solid #C8D7B5;
background-color: #666633;
.bodyFormat tr td {
     color: #000000;
     margin: 3px;
     padding: 1px;
     border: 0px none;
     font-family: Helvetica;
     font-size: 12px;
.alternateRow {
background-color: #C8D7B5;
</style>
<style type="text/css">
div.TableContainer {
height: 121px;
overflow-x:hidden;
overflow-y:auto;
</style>
</head>
<body>
<table cellpadding="0" cellspacing="0" border="0"><tr><td><div id="TableContainer" class="TableContainer" style="height:230px;">
<table class="scrollTable">
<thead class="fixedHeader headerFormat">
<tr class="title">
<td title="Sort" align="center"><b>NAME</b> </td>
<td title="Sort" align="center"><b>Amt</b> </td>
<td title="Sort" align="center"><b>Lvl</b> </td>
<td title="Sort" align="center"><b>Rank</b> </td>
<td title="Sort" align="center"><b>Position</b> </td>
<td title="Sort" align="center"><b>Date</b></td>
</tr>
</thead>
<tbody class="scrollContent bodyFormat" style="height:200px;">
<tr class="alternateRow">
<td>Maha</td>
<td>
<input type="text" name="textfield" size="7" />
</td>
<td align="right"><input type="text" name="textfield2" size="7" /></td>
<td align="right"><input type="text" name="textfield3" size="7" /></td>
<td><input type="text" name="textfield4" size="7" /></td>
<td align="right"><input type="text" name="textfield5" size="7" /></td>
</tr>
<tr>
<td>Thrawl</td>
<td align="right">$9,550</td>
<td align="right">159</td>
<td align="right">100%</td>
<td>Co-Owner</td>
<td align="right">11/07/2003</td>
</tr>
<tr class="alternateRow">
<td>Marhanen</td>
<td align="right">$223.04</td>
<td align="right">83</td>
<td align="right">99%</td>
<td>Banker</td>
<td align="right">06/27/2006</td>
</tr>
<tr>
<td>Peter</td>
<td align="right">$121</td>
<td align="right">567</td>
<td align="right">23423%</td>
<td>FishHead</td>
<td align="right">06/06/2006</td>
</tr>
<tr class="alternateRow">
<td>Jones</td>
<td align="right">$15</td>
<td align="right">11</td>
<td align="right">15%</td>
<td>Bubba</td>
<td align="right">10/27/2005</td>
</tr>
<tr>
<td>Supa-De-Dupa</td>
<td align="right">$145</td>
<td align="right">91</td>
<td align="right">32%</td>
<td>momma</td>
<td align="right">12/15/1996</td>
</tr>
<tr class="alternateRow">
<td>ClickClock</td>
<td align="right">$1,213</td>
<td align="right">23</td>
<td align="right">1%</td>
<td>Dada</td>
<td align="right">1/30/1998</td>
</tr>
<tr>
<td>Mrs. Robinson</td>
<td align="right">$99</td>
<td align="right">99</td>
<td align="right">99%</td>
<td>Wife</td>
<td align="right">07/04/1963</td>
</tr>
<tr class="alternateRow">
<td>Maha</td>
<td align="right">$19,923.19</td>
<td align="right">100</td>
<td align="right">100%</td>
<td>Owner</td>
<td align="right">01/02/2001</td>
</tr>
<tr>
<td>Thrawl</td>
<td align="right">$9,550</td>
<td align="right">159</td>
<td align="right">100%</td>
<td>Co-Owner</td>
<td align="right">11/07/2003</td>
</tr>
<tr class="alternateRow">
<td>Marhanen</td>
<td align="right">$223.04</td>
<td align="right">83</td>
<td align="right">59%</td>
<td>Banker</td>
<td align="right">06/27/2006</td>
</tr>
<tr>
<td>Peter</td>
<td align="right">$121</td>
<td align="right">567</td>
<td align="right">534.23%</td>
<td>FishHead</td>
<td align="right">06/06/2006</td>
</tr>
<tr class="alternateRow">
<td>Jones</td>
<td align="right">$15</td>
<td align="right">11</td>
<td align="right">15%</td>
<td>Bubba</td>
<td align="right">10/27/2005</td>
</tr>
<tr>
<td>Supa-De-Dupa</td>
<td align="right">$145</td>
<td align="right">91</td>
<td align="right">42%</td>
<td>momma</td>
<td align="right">12/15/1996</td>
</tr>
<tr class="alternateRow">
<td>ClickClock</td>
<td align="right">$1,213</td>
<td align="right">23</td>
<td align="right">2%</td>
<td>Dada</td>
<td align="right">1/30/1998</td>
</tr>
<tr>
<td>Mrs. Robinson</td>
<td align="right">$99</td>
<td align="right">99</td>
<td align="right">(-10.42%)</td>
<td>Wife</td>
<td align="right">07/04/1963</td>
</tr>
<tr class="alternateRow">
<td>Maha</td>
<td align="right">-$19,923.19</td>
<td align="right">100</td>
<td align="right">(-10.01%)</td>
<td>Owner</td>
<td align="right">01/02/2001</td>
</tr>
<tr >
<td>Thrawl</td>
<td align="right">$9,550</td>
<td align="right">159</td>
<td align="right">-10.20%</td>
<td>Co-Owner</td>
<td align="right">11/07/2003</td>
</tr>
<tr class="alternateRow" >
<td><strong>TOTAL</strong>:</td>
<td align="right"><strong>999999</strong></td>
<td align="right"><strong>9999999</strong></td>
<td align="right"><strong>99</strong></td>
<td > </td>
<td align="right"> </td>
</tr>
</tbody>
</table>
</div></td></tr></table>
</body>
</html>

Similar Messages

  • How to set different font for a particular row in jtables?

    How to set different font size and font type for a particular row in jtable?

    More than enough sample code here:
    [http://java.sun.com/docs/books/tutorial/uiswing/components/table.html]
    db

  • How to set different color for items in selectManyCheckbox

    hi,
    I would like to change item text background color for each item on selectManyCheckbox (different for each item).
    It is only 5 items so that could be static reference or select.
    I know only how to change background for all items
    af|selectManyCheckbox::item-text {
        background:orange;
    How to select concrete item text and change color for only them?
    I found similar problem:
    css - Set background color of every individual checkbox of p:selectManyCheckbox - Stack Overflow
    but this dont work for me because I dont have in adf tr structure
    I need somethink like this:
    af|selectManyCheckbox::item-text XXXX - select here one of the item by number on list or id  {
        background:orange;

    hi,
    thanks Alejandro and Federico for answers.
    I use JDev 11.1.1.6. I dont write it in previously post because I think that is a more css then adf problem.
    I have 5 selectItem based on simple List<String> {"text1", "text2", "text3", "text4". "text5"}:
    <af:selectManyCheckbox label="List" id="smc2"
                                               layout="horizontal"
                                               value="#{bean.listInBean}"
                                               autoSubmit="true">
                          <af:selectItem label="text1" value="text1" id="si47"/>
                          <af:selectItem label="text2" value="text2" id="si43"/>
                          <af:selectItem label="text3" value="text3" id="si46"/>
                          <af:selectItem label="text4" value="text4" id="si45"/>
                          <af:selectItem label="text5" value="text5" id="si44"/>
                        </af:selectManyCheckbox>
    and I would like to color first selectItem text to orange, second to red.. etc, The list is a static list. Not would be changed.
    After Alejandro answer I build simple for each element (anyCollection contains item with two fields: textValue and label {(text1,text1), (text2,text2)...}
      <af:forEach items="#{bean.anyCollection}"
                                      var="item">
                            <af:selectItem id="si48" value="#{item.textValue}"  styleClass="yourClassName#{var.index}"
                                           label="#{item.label}"/>
                          </af:forEach>
    And now if I have my var called "item" I can write 5 css style classe yourClassName#{var.index} with different color, but there is a problem:
    Attribute styleClass is not defined for af:selectItem
    If it will be so simple I will just add 5 style classes for each selectItem
    <af:selectItem label="text1" value="text1" id="si47" styleClass="yourClassName0"/>
    <af:selectItem label="text2" value="text2" id="si43" styleClass="yourClassName1"/>
    Should I use other component then adf facer rich?

  • Set different color for one JTree node

    hello,
    I managed to find how to set a color for Jtree nodes but the problem is that with my method all the nodes will b the same color whereas i'm looking to have nodes of different color depending on the situation.
    the method for setting all Jtree nodes the same color(other than black):
    tree.setCellRenderer(
    new DefaultTreeCellRenderer() {
       public Color getTextNonSelectionColor() {
         return Color.lightGray; } });I WANT TO CHOSSE EACH COLOR FOR EACH NODE
    help plz
    thanks

    You need to implement TreeCellRenderer interface
    public Component getTreeCellRendererComponent(JTree tree,
                                                  Object value,
                                                  boolean sel,
                                                  boolean expanded,
                                                  boolean leaf,
                                                  int row,
                                                  boolean hasFocus)You can know which node is rendering by check value argument. Please read DefaultTreeCellRenderer's code.

  • How to create a Platinum,Gold and Silver Customer and how to set different price for a single material based on customer?

    Hi All,
    How to create a Platinum,Gold and Silver Customer and how to set different price for a single material based on customer?
    Assume Material is Pen.
    While creating Sales Order in VA01 how to bring different price for the same material for Platinum,Gold and Silver Customers.
    Kindly help me out.
    Thanks,
    Renjith Jose

    A good place to start is http://www.javaworld.com/javaworld/javatips/jw-javatip34.html
    Also, do a search in this forum on HttpURLConnection. That class allows you to use POST method to send form data to a web server.
    "Hidden" variables are only hidden in HTML. The HTTP that gets POSTed to the web server doesn't distinguish between hidden and not hidden. That is, the content you would write to the HttpURLConnection.getOutputStream() would be something like:
    hidden=1&submit=ok(Of course, the variable names would depend on what the web server was expecting from the form.)
    Also, be sure to set the Content-Type request parameter to "application/x-www-form-urlencoded"

  • How to set background color for selected days in DateChooser

    How to set background color for selected days. I created
    checkbox for each day [Son,Mon,Tue,Wed,Thu,Fri,Sat] and a
    DateChooser, I want to change the background color for the selected
    day when i click on a button after selecting the desired checkboxs
    [ monthly wise/yearly wise]
    Thanks in advance

    There is no button involved in the following code, but it may
    be of use to you:
    <?xml version="1.0"?>
    <mx:Application xmlns:mx="
    http://www.adobe.com/2006/mxml"
    creationComplete="init()">
    <mx:Script>
    <![CDATA[
    private var origColor:uint;
    private function init():void {
    origColor = dc.getStyle("selectionColor");
    public function setBackGrdColors(newColor:uint):void {
    dc.setStyle("selectionColor", origColor);
    if(dc.selectedDate){
    var dayOfWeek:Number = dc.selectedDate.day;
    else{
    return;
    switch(dayOfWeek) {
    case 0:
    if(sun.selected)
    dc.setStyle("selectionColor", newColor);
    break;
    case 1:
    if(mon.selected)
    dc.setStyle("selectionColor", newColor);
    break;
    case 2:
    if(tue.selected)
    dc.setStyle("selectionColor", newColor);
    break;
    case 3:
    if(wed.selected)
    dc.setStyle("selectionColor", newColor);
    break;
    case 4:
    if(thu.selected)
    dc.setStyle("selectionColor", newColor);
    break;
    case 5:
    if(fri.selected)
    dc.setStyle("selectionColor", newColor);
    break;
    case 6:
    if(sat.selected)
    dc.setStyle("selectionColor", newColor);
    break;
    default:
    break;
    ]]>
    </mx:Script>
    <mx:VBox horizontalAlign="center" verticalGap="20">
    <mx:DateChooser id="dc" textAlign="left"
    change="setBackGrdColors(cellColor.selectedColor)"/>
    <mx:HBox width="100%" horizontalAlign="center">
    <mx:CheckBox id="sun" label="Sun"/>
    <mx:CheckBox id="mon" label="Mon"/>
    <mx:CheckBox id="tue" label="Tue"/>
    <mx:CheckBox id="wed" label="Wed"/>
    </mx:HBox>
    <mx:HBox width="100%" horizontalAlign="center">
    <mx:CheckBox id="thu" label="Thu"/>
    <mx:CheckBox id="fri" label="Fri"/>
    <mx:CheckBox id="sat" label="Sat"/>
    </mx:HBox>
    <mx:HBox width="300" horizontalAlign="center">
    <mx:Label text="Background Color" />
    <mx:ColorPicker id="cellColor"
    selectedColor="#FF00FF"/>
    </mx:HBox>
    </mx:VBox>
    </mx:Application>

  • A quick way to set different color for certain items in JList?

    is there a quick way of setting different color for certain items in JList?

    Either use HTML strings as the values in your JList (quickest, but may not be the most convenient, especially if your model isn't just text), or create your own ListCellRenderer (e.g. extend DefaultListCellRenderer).
    There is no such thing as "list.setItemForeground(int index, Color c)". You'll have to use one of the methods above.

  • How to set different header for different Standard report page

    How to set different header for different Standard report page

    Hi,
    A easy answer would be use the 'set report header text.vi' but maybe you are talking about something else ?

  • How to set different Icons for Jtreenode

    How to set different Icons for Jtreenode,i want to set icons for jtreenode,not only for leaf,open,closeicon,i hope that each node has a different icon.Thanks!

    you need to check for the node value within a renderer, then assign an icon based on what you expect to get back.
    check out this page. http://java.sun.com/docs/books/tutorial/uiswing/components/tree.html

  • How to set different icons for different windows which is seen in the top left corner?

    Hi
    How to set different icons for different windows which is seen in the top left corner? I know when building exe there is a option to edit icons or add icons and that icon is default for all the windows in the project. But i want different icons for different windows which is possible in VB.
    Is there any way to set icon by calling any dlls.
    Thanks & Regards
    Samuel J
    [email protected]

    Hi Sam,
    no problem. See the attachment.
    Mike
    Attachments:
    TestIcon_LV85.zip ‏44 KB

  • How to set the color to the particular row in a report

    Hi
    I have a report in which I have an edit link(I changed the id as edit link)..When I click that link, all the details(the whole row details) will be appearing on the items nearer to the report to save the changes....
    I want to set the color for the particular row when a link is clicked and the color should not be changed until I save the changes in items...After saving the changes, the report should come in the normal color...this is my requirement..i refered many forums regarding this...But could not find solution....If anyone knows,please help me...
    Fazila

    Here is how I would implement
    Create renderer
    Add SkinnableContainer element and create a skin for this container namely SkinnableContainerSkin
    find the fill section in the skin
    add bitmap fill to the fill section and give the source of the image which you are planning to use(Hopefully this is a direct way of doing, may be you need to hack this a little to get it to work)
    I've never tried this, but should help you give some idea.

  • How to set different sounds for different events?

    Hello I had Xiaomi Mi2s before and I could set different sound for every email account I had, for sms, for facebook and so on. How do I do it on my Xperia? Of course that for example SMS is more important then some facebook comment, so I would like to hear what happened because not every time I want to reach my phone.

    Open each app > menu > settings > notification sound > change the sound > done > repeat as needed 
    "I'd rather be hated for who I am, than loved for who I am not." Kurt Cobain (1967-1994)

  • How to set different ringtones for contacts ?

    hi!, i got my iphone friday night and ive tried setting different ringtones for different people..but it doesnt work...my normal ringtone is disturbed..when my friends call..i want it to be different for each one of them..i changed it in the contacts...everytime they used to call it would say there name..ever since i put the ringtone in..the phone doesnt recognize the contact?

    Try a reset and/or restore.
    It should work, mine work properly.

  • WLC AireOS 8.0 - how to set font-color for integrated webauth/weblogin?

    Hello,
    up to AireOS 7.6 I was able to set the font-color of the internal webauth/weblogin page using html-codes, for example like this:
    Headline: Welcome to our <font color="red">guest</font>-network!
    Message: You need a valid <font color="blue">user</font> to login.
    Now with AireOS 8.0 this doesn't work anymore. When I try to set a headline or message with font-tags I get "Error while setting headline." (or "...message.") when I hit apply. I have to remove the font-tag to save the weblogin page.
    #CLIWEB-6-CLIWEB_INVALID_HTML_TAGS_USED: [PA] cli_web_api.c:1748 The Customization message field has invalid html tags
    #CLIWEB-6-CLIWEB_INVALID_HTML_TAGS_USED: [PA] cli_web_api.c:1663 The Headline field has invalid html tags
    So, how can we now set different font colors/styles like in previous releases? Using external or uploading selfmade pages is not an option.
    Thanks,
    Chris

    Since your using code to change the default internal portal page look, its better for you just to create a custom webauth and upload that to the WLC.  That is how I do my implementations as its easier for me to create a new page than trying to mess around with the internal page.  As you can see, Cisco can change the way things work in every version.  It might just be the fact that they no longer are allowing html code to be inserted in the default webauth/passthrough page.
    Scott

  • How to set different color text in JTabe cell

    Hi
    I have been searching many forums to find how can this be done, but no success.
    I have Custom JTable with MyTableRenderer which is nothing else but alternate the color of rows(cells), CustomTableModel extends DefaultTableModel adding functionality for updateCellContent with different messages.
    I have a column in which cells i want to set these messages in different color.They are not set by user's editing, and by updating the content using the table model.
    Here is the code for that
    public void updateCellContent(HashMap<String, String> messages, int col) {
            for (int row = 0; row < this.dataVector.size() - 1; row++) {
                //This value is hardcoded for now.
                boolean isError = true;
                String filename = getFilename(row);
                String message = messages.get(filename);
                if (message != null) {
                    if (isError) {
                        setErrorMessage(message, row);
                    } else {
                        setMessage(message, row);
        private void setErrorMessage(String message, int row) {
            this.setFileStatus(message, row);
        private void setMessage(String message, int row) {
            String value = (String) this.getValueAt(row, COL_FILE_STATUS);
            ((Vector) this.dataVector.get(row)).setElementAt(value + " " + message, COL_FILE_STATUS);
            fireTableCellUpdated(row, COL_FILE_STATUS);
    public void setFileStatus(String message, int row) {
            setValueAt(message, row, COL_FILE_STATUS);
        }Thanks
    Dimitar

    I have Custom JTable with MyTableRenderer which is nothing else but alternate the color of rows(cells)If I understand you correctly a better way to do this is to override the prepareRenderer(...) method of JTable. You can search the forum for my "Table Prepare Renderer" (without the spaces) example which shows how this can be done.
    I have a column in which cells i want to set these messages in different color.Then you need to use a custom renderer for that column.
    If you need further help then you need to create a [Short, Self Contained, Compilable and Executable, Example Program (SSCCE)|http://homepage1.nifty.com/algafield/sscce.html], that demonstrates the incorrect behaviour.

Maybe you are looking for