Looking for a generic Tree component

Able Johnson-Oracle

Hi ,

I am new to oracle JET.I was looking for a tree component for my application with the following features

1,User should be able to specify a div as a tree node.This is the ultimate requirement if this is not possible user should be able to do the below ,because all below points can be easily implemented if I could specify a div as a tree node

2.User should be able to use Font awesome icons(Font awesome icons are not images user should be able specify the icon class).

3,User should be able to specify tooltip (Tooltip can be a div)

4,User should be able to Expand&Collapse

5,User should be able to specify style class

6,User should be able to specify hover class

7,It should be compactable with oj-popup

My question is

1, Is there any existing tree components with these features? I saw oj-tree but I am not sure if I can use font-awesome icons, specify the class or set div as node

2, If there is no component with these capabilities any ideas or suggestions how to write a new tree component?

Hugh Zhang-Oracle

I'm not too familiar with ojTree, but it looks like it does support HTML content for the tree nodes. Please see this demo and simply place your div inside the list nodes:

Tree - Using local HTML

Hope this helps,

Hugh

Hugh Zhang-Oracle

I'm not too familiar with ojTree, but it looks like it does support HTML content for the tree nodes. Please see this demo and simply place your div inside the list nodes:

Tree - Using local HTML

Hope this helps,

Hugh

John 'JB' Brock-Oracle

I would recommend looking at the same demo that Hugh has pointed you at.

A couple of points to your original list:

• Oracle JET uses a list structure ( UL / LI ) for the ojTree component because it helps meet Accessibility guidelines much better than any div structure would. Hopefully you are writing your application to meet accessibility needs.
• If you don't like the functionality of the ojTree component, you can look through the number of jQueryUI tree components that are available on the Internet and try using those with JET.  There shouldn't be any issues in using a different component.  You would need to provide the updated CSS to make it match the rest of your page of course.
• From the list of requirements, it sounds like you are trying to build something that an end user would be adding to the page, versus the developer of the page using.  JET really isn't designed for that out of the box, but of course you can add functionality to your application that would allow the end user to change specific properties that you want, and then you would do the actual changes programmatically behind the scenes.

Able Johnson-Oracle

Yes it is working!Thank you:)