Discussions
Categories
- 196.7K All Categories
- 2.2K Data
- 235 Big Data Appliance
- 1.9K Data Science
- 449.9K Databases
- 221.6K General Database Discussions
- 3.8K Java and JavaScript in the Database
- 31 Multilingual Engine
- 549 MySQL Community Space
- 478 NoSQL Database
- 7.9K Oracle Database Express Edition (XE)
- 3K ORDS, SODA & JSON in the Database
- 532 SQLcl
- 4K SQL Developer Data Modeler
- 186.9K SQL & PL/SQL
- 21.3K SQL Developer
- 295.4K Development
- 17 Developer Projects
- 138 Programming Languages
- 292.1K Development Tools
- 104 DevOps
- 3.1K QA/Testing
- 645.9K Java
- 28 Java Learning Subscription
- 37K Database Connectivity
- 153 Java Community Process
- 105 Java 25
- 22.1K Java APIs
- 138.1K Java Development Tools
- 165.3K Java EE (Java Enterprise Edition)
- 17 Java Essentials
- 158 Java 8 Questions
- 85.9K Java Programming
- 79 Java Puzzle Ball
- 65.1K New To Java
- 1.7K Training / Learning / Certification
- 13.8K Java HotSpot Virtual Machine
- 94.2K Java SE
- 13.8K Java Security
- 203 Java User Groups
- 24 JavaScript - Nashorn
- Programs
- 398 LiveLabs
- 37 Workshops
- 10.2K Software
- 6.7K Berkeley DB Family
- 3.5K JHeadstart
- 5.6K Other Languages
- 2.3K Chinese
- 170 Deutsche Oracle Community
- 1.1K Español
- 1.9K Japanese
- 230 Portuguese
No Hover behavior for Custom components?

I created a custom component with a oj-list-view inside its structure.
The list renders fine but I am not seeing the same hover behavior for the rows of the list as I do in the cookbook.
I checked the css in the cook book but there could not quite see how the hover behavior is originating for a list outside a Custom component. So the conclusion is perhaps that for oj-list-view used directly through the index.html, the behavior does not differ so much.
But for a custom component, I believe the .root descriptor is different. This may be explaining why the list item styling does not change on mous hover.
But again, another observation is that I used a oj-web-applayout-header class for one of the elements and it works perfectly (sticks to the bottom of the screen).
The question now is, can oj-list-view or other standard componets used inside custom components reuse the style declarations from the redwood.css of the SPA (which gets injected at build time)? Or do I need to do some import for the specific component styles with the procedure mentioned in 4b of this page from the dev guide?
Answers
-
Not sure what Cookbook example you are looking at, but if you are looking for hover effects like in "https://www.oracle.com/webfolder/technetwork/jet/jetCookbook.html?component=listView&demo=arrayListView", then you are most likely missing "selection-mode". If you set this to single, then you will get the hover functionality, which implements the --oj-core-bg-color-hover variable. You could set that in your root to have all your hover colors the same, or implement it within your component css
-
Thank you Nathan.
Your solution is one possible way of looking at it. The actual issue, I just discovered is that I was not importing these components in my viewModel. The nodes are present in my view (htm) but was not importing them in the typescript part.
I checked if the solution I found is indeed solving my problem. I removed the import declarations thrice and added them back. I can repeat the behavior.. So possibly I am missing some logic in the binding workflow. Will figure that out. But for now, I have inched forward