cancel
Showing results for 
Search instead for 
Did you mean: 

Customizing TreeView component

deepa_prabhu
Participant
0 Kudos
93

Hi,

Is it possible to customize the TreeView htmlb Component

with components like checkbox? ... To clearly state my requirement, I would like to add a checkbox at each node of the tree so that I will handle some logic when the checkbox corresponding to the node is selected.

I mean that every node and element should have a corresponding checkbox and when I check a node or element

I should be able to determine whether the value of checkbox(Checked or unchecked) and based on that I will handle some business logic.

Is this customization possible in HTMLB TreeView?

If so, Can you please guide me with the steps?

If not, what is the alternative?

Thanks and regards

Deepa

Accepted Solutions (0)

Answers (2)

Answers (2)

Former Member
0 Kudos

Yes it is possibele.

You have to extend TreeNode class.

...

public class KmTreeNode extends TreeNode {

...

in this extended class you define your own node implementation - for example GridLayout with check box and text view - and then you set it as component for your implementation...

...

this.setComponent(glNode);

...

Now you can use your tree node instead of standart tree node

Ahoj

ONDREJ

deepa_prabhu
Participant
0 Kudos

Hi Yoav and Ondrej,

Thanks for your instant reply, Can you please post a sample code?

regards

Deepa

deepa_prabhu
Participant
0 Kudos

Hi,

Now I have created a gridlayout containing a checkbox and text and has placed it as a treenode component.

The code for the same is as follows.

//DynPage

/**

  • Create output. Called once per request.

*/

public void doProcessBeforeOutput() throws PageException {

// get the form from DynPage

Form form = (Form) this.getForm();

Tree tree = new Tree("sample", "sample");

tree.setTooltip("Personalize your content");

TreeNode rootNode = new TreeNode("sample","sample");

rootNode.setOpen(true);

rootNode.setText("Root Folder");

rootNode.setComponent(getCustomNodeComponent(rootNode));

rootNode.setTooltip("samplepersonalization");

rootNode.setOnNodeClick("onNodeClick");

tree.setRootNode(rootNode);

TreeNode firstLevel = new TreeNode("folders", "folder",rootNode);

firstLevel.setText("folder");

firstLevel.setComponent(getCustomNodeComponent(firstLevel));

firstLevel.setOnNodeClick("onNodeClick");

form.addComponent(tree);

// create your GUI here....

}

public GridLayout getCustomNodeComponent(TreeNode node)

{

GridLayout personalize = new GridLayout();

personalize.setId("personalize");

personalize.setCellSpacing(5);

//personalize.setWidth("50%");

//personalize.setDebugMode(true);

String nodeName = node.getText();

GridLayoutCell cell1 = new GridLayoutCell("cell1");

cell1.setContent("<p style=\"font-family:Arial;font-size:70%\">"nodeName"</p>");

personalize.addCell(1,1,cell1);

GridLayoutCell cell2 = new GridLayoutCell("cell2");

Checkbox checkBox = new Checkbox(nodeName+"check");

checkBox.setChecked(true);

cell2.setContent(checkBox);

personalize.addCell(1,2,cell2);

return personalize;

}

And the tree is also rendered fine with checkbox at each node.

Now my question is how will I get the value of checkbox component in the TreeNode?

Can anyone help me out in this?

Regards

Deepa

Message was edited by: Deepa Jampunathan

Former Member
0 Kudos

Hello Deepa,

Since you used:

Checkbox checkBox = new Checkbox(nodeName+"check");

You'll need to use:

this.getComponentByName(nodeName+"check")

with the same nodeName.

Hope that helps,

Yoav.

deepa_prabhu
Participant
0 Kudos

Hi Yoav,

That will not work and it is also not workinng. It throws NullPointerException for checkbox component.

Now the question is the components are packed into a gridlayout and set as TreeNode component. How to retrieve these component from gridlayout which are packed inside the TreeNode?

The getComponent from the treenode as returns null.

Is there any means to retrieve values of custom components set inside the tree node?

Thanks and regards

Deepa

Former Member
0 Kudos

Hi Deepa,

I have used this code <b>successfully</b> for a TreeNode

that contained a Gridlayout with a Checkbox and a TextView in it.

I can only suggest to re-check that the Checkbox name

you used is correct and case-sensitive.

Yoav.

Former Member
0 Kudos

Hi Deepa,

It is possible.

use TreeNode's setComponent method to add an htmlb component.

To check the componen't value you can use the usual

this.getComponentByName("chkboxName");"

Hope that helps,

Yoav.