How do I disable mouseover styling?
Hello Kenneth,
After investigating this further, I determined that your requirement could be achieved by binding a method to the onmouseover event of the grid. In this method it is checked whether the target is a cell, if yes, the background color of all cells from that row is set to transparent.
$("#grid").on("mouseover", function (evt, ui) {
if (evt.target.tagName == "TD") {
for (let i = 0; i < evt.target.parentNode.children.length; i++) {
evt.target.parentNode.children[i].style.backgroundColor = "transparent";
}
});
Below I am attaching a sample, demonstrating the described behavior. Please test it on your side and let me know if you need any further information regarding this matter.
Regards, Monika Kirkova, Infragistics
igGridHoverStyle.zip
Hi Monika,Thanks for the quick reply. That works for any background styling, but I have some foreground coloring and bolding on the grid that I need to stay the same on mouseover.
A solution for disabling the hover style and persisting the currently applied styles to the grid is to use the enableHoverStyles property of the grid. By setting this property to false, the "ui-state-hover" class would not be applied to the cells. This could be achieved as follows:
$("#grid").igGrid({
. . .
enableHoverStyles : false,
0363.igGridHoverStyle.zip
That did it! Thank you!
I am glad that you find my suggestion helpful and were able to solve your issue.
Thank you for using Infragistics components.