+ Start a Discussion
PrappPrapp 

How can I set color of row, when the mouse over of row?

Hi All,

 

I am crating the Visualforce page. I use the <dataTable> tag for displaying data, but it does not have any highlight on the selected row same as using <pageBlockTable> tag.

 

Could anyone give me the suggestion, how I can control it? I am very new in visualforce and web coding.

Best Answer chosen by Admin (Salesforce Developers) 
prageethprageeth
Hello Prapp;
  You can do this by using JS.
  Add "onMouseMove" and "onMouseOut" events to your columns as below.

<apex:page controller="MyClass">

<apex:datatable value="{!myList}" var="v">

<apex:column value="{!v}" onmousemove="this.style.backgroundColor='green'" onmouseout="this.style.backgroundColor =''"/>

</apex:datatable>

</apex:page>  


All Answers

prageethprageeth
Hello Prapp;
  You can do this by using JS.
  Add "onMouseMove" and "onMouseOut" events to your columns as below.

<apex:page controller="MyClass">

<apex:datatable value="{!myList}" var="v">

<apex:column value="{!v}" onmousemove="this.style.backgroundColor='green'" onmouseout="this.style.backgroundColor =''"/>

</apex:datatable>

</apex:page>  


This was selected as the best answer
PrappPrapp

Hello Prageeth,

 

Thanks you for your help. I have tried it and it work.

 

Prapp.

colemabcolemab

I know this is an old post but I wanted to update this for anyone else that is looking.

 

The code given seems to only highlight the cell in question and not the row.

 

I think this is what you need to highlight the row:

onmousemove="this.parentNode.style.backgroundColor='green'" onmouseout="this.parentNode.style.backgroundColor =''"

 

Randall PetitRandall Petit
Is this script working for mouse like autocad types for example check this : (https://dpimouse.com/best-mouse-for-autocad-drafting/)