Table row change color on hover

Hi,
I don't know if it's possible to change table row color on mouse hover, I've been looking at skin-selectors (http://www.oracle.com/technology/products/jdev/htdocs/partners/addins/exchange/jsf/doc/skin-selectors.html#Global%20Selectors) and I haven't found any row style class for af:table Component... if anyone knows how to achieve this I would be thankful.

Hi,
I replied to the other question of yours. I don't think this is possible because the row is not a component that can have a style applied to it. You may be more successful in applying the CSS to the components (outputText or inputText) on the table cells.
Frank

Similar Messages

ADF Table row background color change ???

Hi All
i got below sql view object
SELECT DEPARTMENT_ID,JOB_ID,COUNT(*) FROM EMPLOYEES GROUP BY DEPARTMENT_ID,ROLLUP(JOB_ID)
By using this i will get each department_id, jobid's and total employes count in each department
and i will get rollup for each departments ie i will get total employees.
So i want to change the back ground of the total row.
DepartmentId     JobId     Count1
SA_REP 1
1
10     AD_ASST     1
10     1 < this row in RED back ground in JSF page
20     MK_MAN     1
20     MK_REP     1
20     2 < this row in RED back ground in JSF page
30     PU_MAN     1
30     PU_CLERK     5
30     6< this row in RED back ground in JSF page
40     HR_REP     1
40     1< this row in RED back ground in JSF page
50     ST_MAN     5
50     SH_CLERK     20
50     ST_CLERK     20
50     45< this row in RED back ground in JSF page
any kind of help is welcome...
thanks
Ravi

Hi,
you can do this by setting the background color of the outputText component that is the cell component e.g. in a read only table. Use the inlineStyle property to set the background-color but get the string from a managed bean. For each row you get a call to the managed bean and you can use JSF value binding
FacesContext.getCurrentInstance().getApplication().createValueBinding()
to access #{row} so that you can determine the value of a row column. Based on this you return a color
Frank

Why isnt link changing colors over hover in IE?

here is the style.css code. this works in firefox but not in
IE. i just want the font color to change from white to crimson upon
hover. plz help.
.MenuLink {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 18px;
color: #FFFFFF;
text-decoration: none;
margin-left: 0px;
.MenuLink a:link {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 18px;
color: #FFFFFF;
text-decoration: none;
margin-left: 0px;
.MenuLink a:hover {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 18px;
color: #AD0C28;
text-decoration: none;
margin-left: 0px;
.MenuLink a:visited {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 18px;
color: #FFFFFF;
text-decoration: none;
}

Or even this -
.MenuLink a:link, .MenuLink a:visited {
color: #FFFFFF;
text-decoration: none;
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"Gary White" <[email protected]> wrote in message
news:[email protected]..
> On Thu, 13 Nov 2008 15:11:26 +1030, "John Waller"
> <[email protected]> wrote:
>
>>The order of the rules is crucial.
>>
>>Link
>>Visited
>>Hover
>>Active
>>
>>Try:
>
> Or try this to get rid of some of the unnecessary
redundancy:
>
> .MenuLink {
> font-family: Georgia, "Times New Roman", Times, serif;
> font-size: 18px;
> color: #FFFFFF;
> text-decoration: none;
> margin-left: 0px;
> }
>
> .MenuLink a:link {
> color: #FFFFFF;
> text-decoration: none;
> }
>
> .MenuLink a:visited {
> color: #FFFFFF;
> text-decoration: none;
> }
>
> Gary

Problem updating a table-row (changes are commited after "prerender()")

Hi,
I hope someone can help me on this:
Background-info:
The page which gives me problems should (and is) displaying one record of a query at a time. Depending on the button which can be pressed, the page should just display the next entry ("Next->") or change one column of the current entry and jump to the next entry ("Wrong / Next->"). After the last entry, the query should be (and is) executed again and the page should display the first column, which fits the query-criterias.
The problem:
If the query just finds one record, the record is displayed on that page.
By pressing the "Next->" button, the page displays the same record again (like it should). By pressing the "Wrong / Next->" button, the page displays the same record again, although - like described above - one column was changed by that action and the query (which should and is executed again)
should not find that record anymore. By pressing the "Wrong / Next->" button again, the page is not displaying a record anymore (like I expected it from the first time pressing that button).
Technical Info:
I am using one DataProvider for the "select" and an other one for the "update".
Both are working fine.
The "select" is called in the method "prerender()" and the "update" is called in the action of the button "Wrong / Next->".
I debuged the program and found out, that the column of the database entry is changing it�s value not after processing the action of the button (like it should), but AFTER processing the method "prerender()". I tried to force the action of the button to commit the changes (xyDataProvider.commitChanges();), but without success.
Code:
public String buttonWrong_action() {
    try
        // Execute the Update-Statement
        sessionBean1.getXyRowSet().setObject(1, "2");
        sessionBean1.getXyRowSet().setObject(2, cardId);
        sessionBean1.getXyRowSet().setObject(3, operatorId);
        xyDataProvider.refresh();
    catch(Exception e)
    // Jump to the next record (set cursor)
public void prerender() {
    try
        // Execute the Select-Statement
        sessionBean1.getZRowSet().setObject(1, operatorId);
        sessionBean1.getZRowSet().setObject(4, resultId); // ResultId (1 = Right, 2 = Wrong)
        zDataProvider.refresh();
        zDataProvider.cursorFirst();
        cardId       = sessionBean1.getCardRowSet().getString("id");
    catch(Exception e)
}

I suggest you read and understand Joel's blogs -
http://blogs.sun.com/jfbrown
Creator's CachedRowSet is designed for SELECT statements (only) and updating the ResultSet you get from that SELECT statement.
(http://blogs.sun.com/jfbrown/entry/using_rowsets_for_crud_or )
dataprovider.refresh() does not re-execute the rowset's command. It just means to "clear the previous results".
(http://blogs.sun.com/jfbrown/entry/cachedrowsetdataprovider_and_cachedrowset_info )
So here's how cachedRowSet's are designed to work:
Set you rowset's command to:
SELECT resultid FROM cardresult
WHERE cardid = ?
AND operatorid = ?
They your code would do something like this:
dp.getCachedRowSet().setObject(1, ...) ;
dp.getCachedRowSet().setObject(2, ...) ;
dp.getCachedRowSet().release() ; // clear last results.
boolean gotOne = dp.cursorFirst() ; // will cause execution
if ( gotOne ) {
    dp.setValue('resultid', '2') ;
    dp.commitChanges() ;
} else {
    error("can't update") ;
}You'll have to adjust that code - it's just a generic example.
Don't forget to add try/catch for a RuntimeException!
The alternative is to write your own JDBC.
You can use either.
Personally I'd just write a little helper class to assist me with using plain old JDBC for this.

Getting error while setting color to table rows?

Hi All
I am trying to setting colors to table rows based on dropdown value.
lv_Dropdown vaue =1 i want to set one color, 2-another color like that.
For this I create attribute CELL_DESIGN of type WDUI_TABLE_CELL_DESIGN in node, and i bind this attribute to every column celldesign property in table. and my code in on select of dropdown.
data lr_column type ref to cl_wd_table_column.
data:obj_table type ref to cl_wd_table.
lr_column = obj_table->get_column( id = 'TABLE_WEEK1' ).
if lv_dropdown = 1.
   lr_column->set_cell_design(
cl_wd_table_column=>e_cell_design-badvalue_dark ).
endif.
lr_column->bind_cell_design( path = 'SEGMENT1.CELL_DESIGN' ). ...Giving dump at r_colum = get_column( )
I follow correct code or not??
Cheers,
Venkys.

Sorry Sarbjeet and baskaran i am not getting,
I want to set colors to row of a table on dropdown selection. In dropdown i ahve a code like
DATA lo_nd_segment1 TYPE REF TO if_wd_context_node.
DATA lo_el_segment1 TYPE REF TO if_wd_context_element.
DATA ls_segment1 TYPE wd_this->Element_segment1.
data lt_segment1 type wd_this->elements_segment1.
DATA lv_segment TYPE wd_this->Element_segment1-segment.
navigate from <CONTEXT> to <SEGMENT1> via lead selection
lo_nd_segment1 = wd_context->get_child_node( name = wd_this->wdctx_segment1 ).
get element via lead selection
lo_el_segment1 = lo_nd_segment1->get_element( ).
lo_el_segment1 = WDEVENT->GET_CONTEXT_ELEMENT( 'CONTEXT_ELEMENT' ).
get all declared attributes
lo_el_segment1->get_static_attributes(
    IMPORTING
      static_attributes = ls_segment1 ).
DATA : lv_dropdown type string .
lv_dropdown = ls_segment1-segment.
if lv_dropdown = 1. SET ONE COLOR TO THAT ROW
endif.
if lv_dropdown = 2. SET ONE COLOR TO THAT ROW
endif.
Now what should be the code in WDMODIFYVIEW method to set table row with colors.
Cheers,
Venkys.

How can i set the alternating colors for a table rows

Dear All,
Please any one help me how can i set the Alternating colors for Table Rows.
i created a theam there i set the background alternating color to brown and i set the table design properity to alternating. but it is not reflecting.

Hi,
The design property in Table properties should work for your requirement. Select "alternating" value for design.
Please see the API below:
design
Determines the appearance of the table. The property design can take the following values and is represented by enumeration type WDTableDesign.
alternating - The table rows are displayed alternately in a different color.
standard - The table background has one color. The individual table rows are displayed with grid net lines.
transparent - The table background is transparent. The individual table rows are displayed without grid net lines.
Check whether you have changed the right property or not? Also table should contain more than one rows to test this scenario.
Regards,
Jaya.
Edited by: VJR on Jun 17, 2009 6:43 PM

Hover table row style doesn't work in IE

I found a great way to create a rollover effect when you
hover over a table row, by giving the row a class of "resultsRow"
and using the following rules in my stylesheet:
.resultsRow {
background-color: #EAEEB1;
.resultsRow:hover {
background-color: #D2DE56;
This works perfectly in Firefox, but doesn't work at all in
Internet Explorer, which is what most of our audience will be
using. Does anyone know a fix for this in Internet Explorer?

On Thu, 20 Jul 2006 08:21:43 +0000 (UTC), "Claire S"
<[email protected]> wrote:
> .resultsRow {
> background-color: #EAEEB1;
> }
> .resultsRow:hover {
> background-color: #D2DE56;
> }
>
> This works perfectly in Firefox, but doesn't work at all
in Internet Explorer,
>which is what most of our audience will be using. Does
anyone know a fix for
>this in Internet Explorer?
As you've seen, IE is ancient and doesn't support it. You can
do it
pretty easily with JavaScript:
<style type="text/css">
.resultsRow {
background-color: #EAEEB1;
.resultsHover {
background-color: #D2DE56;
</style>
<tr class="resultsRow"
onMouseOver="this.className='resultsHover'"
onMouseOut="this.className='resultsRow'">
Gary

How to change color in table header

I have a table model like below I can change column colors (background or foreground ) but I couldn't change table headers color in my application . Basicly I want to change color of "Grup Adı","Kişi Sayısı" column headers.
Please help
thanks
class MyTableModel extends AbstractTableModel {
public String[] columnNames = {
"Grup Adı","Kişi Sayısı",
public int getColumnCount() {
return columnNames.length;
public int getRowCount() {
return data.length;
public String getColumnName(int col) {
return columnNames[col];
public Object getValueAt(int row, int col) {
return data[row][col];
public Class getColumnClass(int c) {
return getValueAt(0, c).getClass();
public boolean isCellEditable(int row, int col) {
return true;
public void setValueAt(Object value, int row, int col) {
if (DEBUG) {
System.out.println("Setting value at " + row + "," + col
+ " to " + value
+ " (an instance of "
+ value.getClass() + ")");
data[row][col] = value;
fireTableCellUpdated(row, col);
if (DEBUG) {
System.out.println("New value of data:");
printDebugData();
}

You have to implement a TableCellRenderer and affect it to your columns with:myTable.getColumnModel().getColumn(0).setHeaderRenderer(myTableCellRenderer);

Coloring table row using css in pfr

Hi all,
I am using classic table region for loading the records.After loading in PFR using table multiselection selecting one or more than one row then coloring should happen for those selected rows.
In pfr we cann't change bean properties.
Give ur idea.
Thanks,

Hi,
Go through these threads...
Can we colour the rows in the column of a table
Changing Color of a value in a column
Thanks,
Gaurav

Coloring a table row

I have a scenario in which i populate data in table ui thru Rfc call.Now I select a particular row then on clicking of a button the row color should change.how do i change colors of a particular row at runtime?
Note:dont not post blogs of colorful tables.
regards
Nikhil Tapkir

Hi Nikhil,
Check out this link
http://help.sap.com/saphelp_nw04/helpdata/en/0e/23b3c8b0a238439f664f73a04e6332/frameset.htm
Thanks
Anup

CSS issue when changing the table row height to 16px

Hello,
After changing the table row height through css like this:
.table-row-cell, .table-cell {
-fx-cell-size: 16;
the table rows are correctly displayed with a 16px height but the cell bottoms seem to be incorrectly set.
For example the following css style (a red 3px bottom border):
.table-cell {
-fx-border-width: 0 0 3 0;
-fx-border-color: red;
doesn't work anymore with the new row height whereas it works with the 24px standard row height.
While investigating with Scenic View, I noticed that changing the row height changes the TableRow layoutBounds height (from 24px to 16px so that's ok) but not the boundsInParent height which remains to 27px. I think it should become 19px (16 + 1.5 + 1.5). I don't know if it's a bug.
Anyway, any help making the css red border working for a 16px row height would be greatly appreciated.
Regards,
Bruno.

Q: Would this help to just use absolute div tags and give me 'ABSOLUTELY ABSOLUTE' positioning?
No. APDivs are not a good primary layout method. Use default CSS positioning (which is no positioning at all). Align page elements with margins, floats and padding.
See example -- 2-Column CSS Layout with Grids
(View Page Source in your browser to see the code)
http://alt-web.com/TEMPLATES/2-col-fixed-with-grid.shtml
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
www.alt-web.com/
www.twitter.com/altweb
www.alt-web.blogspot.com

Based on some conditions table rows should be of different color

Hi Experts,
I have created one WD application which calls RFC. The displayed result is
Trip No    Date                 Status
1             01-jan-2009     Approved
2             05-jan-2009     Rejected
3             09-jan-2009     Cancelled
I want to ensure that row no 1 should be of color 1 (say green color), row no 2 should be of color 2 (say red color) and row no 3 should be of coor 3 (say black color).
How I can do so?
Regards,
Gary

Hi
Please go through this forum, this will help you:
1. How to enable alternating color in a table rows?
2. How to Change the color of rows in a table
3. how to set table alternating color
Thanks
Susmita

Blue-white colored table rows

Hi, table design gurus!
I need in blue-white colored table rows. It looks like Table desing in altenating mode. Alternating mode fits my needs except one. This mode restricts read-only tables but I have regular table with editable cells. Well, I have read an article about how to build colorful tables. Ok, I have got a table in a different colors. But neither blue or white color were not found in WDTableCellDesign. How to use blue and white colors for table row background? I should not ovveride CSS using WD Theme Editor. I want to set a color implicitly in java code. Please, help me.
Any help would be apprecited.

Hi Alexey,
I have never used it, but there is a property called semanticColor in the TextView of the columns of the table.
Go to the layout of the view. Look in the Outline. There you will find Table -> TableColumn -> Caption + TextView. In the properties of the TextView you will find in the semanticColor.
The semanticColor needs to be linked to an element inside the table in the context. So create a node inside the table with cardinality 1..1 and selection 1..1 and add a (calculated) attribute to the node with the correct type (I don't know this one....it is probably inside "com.sap.ide.webdynpro.uielementdefinitions". My guess would be com.sap.ide.webdynpro.uielementdefinitions.TableCellDesign.
Ones you have linked the cell to the attribute in the node you will have to code the changes in color doing something like this. that will probably be easiest if the attribute is of the calculated kind
In the calculated attibute you return WDTableCellDesign.GOODVALUE_LIGHT or whatever color you want.
Hope this helps a bit,
Jeschael

How to verify that the user has changed table row data before db update

Hi all,
Iam using Oracle ADF with EJBs.
I have a single selection table that displays rows of data returned from a function of my data control.
The columns of my table are editable so that the user can change the data. The user selects a row, changes the data in one or more columns of the row and saves the data by means of a submit button. The code in the submit button, identifies the row of the corresponding iterator that the user clicked on and updates the data in the database (using the 'mergeEntity' function of the EntityManager)
Before saving the data, I want to put some logic to check whether the user has actually changed some data to avoid unnecessary updates in the database . But for this I need a technique to detect that the user has indeed changed some data in the table row.
One technique I have been using so far was to isolate the iterator row of the table and then query the corresponding row in the database table and compare their values.
Except from dummy, this technique is not efficient if the table contains many rows.
Moreover, in my case I have observed that on successive updates on the same row , the query on the database returns the new values (user changed values) and not the actual values contained in the database table. This means that when the user updates an iterator row the cached data affect also the results of the SELECT statement from the actual database table!!! Isn't this strange ?
Can somebody propose me a neat method to detect when the user has changed the the data of an iterator row ?

Hey Alan,
The below solution seems overly complicated to me and can not be implemented without a custom screen and/or the use of JavaScript. Also, if your main concern is that a user may accidentally loose all their data because they closed the browser window or the session times out before they hit the save button then this solution does not help you.
There are a couple of simpler approaches you can take here:
# If the use of JavaScript is permissible you can hook into the windows 'onUnload' event, and pop-up a message box which gives the user the opportunity to cancel closing the window and save their case if they haven't already.
# Implement an autosave feature by hooking into one of events provided by web determinations. A simple (but rather naive) way of doing this would be to hook into the OnRenderScreenEvent and call save on the interview session every time the event fires. This guarantees that all the data the user has submitted will aways automatically be saved, thereby removing the need to make sure the user manually saves their data before closing the browser.
Automatically making Web Determinations close a browser window has to be done using JavaScript. However, doing so means that a) it won't work for people who turn off JavaScript, which is commonly done for accessibility reasons b) you'll likely run afoul of the browser's security mechanism (they generally won't let you close a window that you didn't open and some really don't like you doing that at all).
Thanks,
Kristy

Change row's color in report painter

Hi all!!!
anybody knows how change row's color in report painter,
for example
number   name        | money
   7020   payments1 | 100.00
   7021   payments2 | 200.00
    summary            | 300.00
change color of row "7020   payments1" and "7020   payments1"
Regards!!!

Hi,
For it, first place the cursor on the row and choose Formatting > Row. In the next dialog box, select a color (for totals, subtotals, inserted rows, or for emphasis). The system assigns a color based on the selection you make here.
Regards,
SDNer

Table row change color on hover

Similar Messages

Maybe you are looking for