Tree selection programmatically dosnt work

Hello,

i’m really new to vaadin and i’m testing some things.
first: sry for my bad english

Tested with v6.6.6 and 6.7.0 nightly

i have a HorizontalSplitPanel.
on left side i got the menu made with a tree, on the right side i got the content
everything works fine, except one thing:

i have in one contentpage one button. if i push the button i want to show an other contentpage on the right side and i want to select the coresponding menu entry in the tree.

here is the code for creating the tree:


private static final String[] menu = { "Main", "Sub1", "Sub2", "Sub3" };

private Tree createMenuTree() {
		
		Tree tree = new Tree();
		
		for (String menuName : menu) {
			tree.addItem(menuName);
		}
		
		tree.setParent(menu[1]
, menu[0]
);
		tree.setParent(menu[2]
, menu[0]
);
		tree.setParent(menu[3]
, menu[0]
);
		tree.setChildrenAllowed(menu[1]
, false);
		tree.setChildrenAllowed(menu[2]
, false);
		tree.setChildrenAllowed(menu[3]
, false);
		
		tree.setSelectable(true);
		tree.setMultiSelect(false);
		tree.select(menu[0]
); // this select works
		
        // Add ClickListener and Actionhandler
        tree.addListener(this);

        // Cause valueChange immediately when the user selects
        tree.setImmediate(true);
        

        // Expand whole tree
        for (Object id : tree.rootItemIds()) {
            tree.expandItemsRecursively(id);
        }
		
		return tree;
	}

and here is the code for the selecting the item in the tree

public void selectMenu() {
        navigationTree.setValue("Sub3"); // also tested with select
        
        // this is only for testing
       // Sub3 is the last item so if it is selected, b must be true
       boolean b = false;
        for (Object id : navigationTree.getItemIds()) {
			String a = id.toString();
			
			b = navigationTree.isSelected(id);
		}
        
       getWindow().showNotification("test " + b + " - " + navigationTree.getValue().toString());
	}

after calling the method selectMenu() i check if the item is selected…only for verifiing that the code is running correctly

but in the browser the menuentry is not highlighted, but the testcode say it is.

the tree is also set to immediate= true

any ideas?

thank you
bye
mathias

Did you verify that “Sub3” is really the last element you iterate over?
You should rather exit the loop when b becomes true.
Also a question is, whether you have all nodes visible or not, because an invisible node can be selected too.

I was thinking the same thing, as it’s not guaranteed that the getItemIds() returns the IDs in order. Tree essentially uses an IndexedContainer, which does use HashMaps for storing property values, but the item IDs are stored in a list in the order in which they were added.

Nothing particular catches my eye in the code and even tried it a bit with no problems. If the server-side says that the value is selected, but is not visually, it sounds like a client-side rendering problem. Any differences between browsers? Widget set compiled?

Good morning,

thanks for the answers.

@sascha
i verified it. i stept through the code in debug mode.
Sub3 is the last node. if i change the selection to something else, b is false
the nodes are all visible

@marko
before that, i tried the container like the example code in the sampler. but it didn work too.
i tried ie9, chrome 13, firefox 6.02, opera11.5, safari5.1
the behavior is all the same

i did no changes to the widgets, didnt compile anything and only the vaadin.jar is used…no addons

Hi,

I tried your code out with Vaadin 6.6.6 and it seems to work as intended: the correct item is highlighted in the tree and the notification is ‘test true - Sub 3’ is shown. Below are the contents of the whole Application class (omitting imports and class def.):


 private Window mainWindow = new Window();
    private Tree navigationTree;

    @Override
    public void init() {
        setTheme("runo");
        setMainWindow(mainWindow);

        HorizontalSplitPanel hsp = new HorizontalSplitPanel();
        mainWindow.addComponent(hsp);

        navigationTree = createMenuTree();
        hsp.addComponent(navigationTree);
        hsp.addComponent(new Button("Test", new ClickListener() {
            public void buttonClick(ClickEvent event) {
                selectMenu();
            }
        }));
    }

    private static final String[] menu = { "Main", "Sub1", "Sub2", "Sub3" };

    private Tree createMenuTree() {

        Tree tree = new Tree();

        for (String menuName : menu) {
            tree.addItem(menuName);
        }

        tree.setParent(menu[1]
, menu[0]
);
        tree.setParent(menu[2]
, menu[0]
);
        tree.setParent(menu[3]
, menu[0]
);
        tree.setChildrenAllowed(menu[1]
, false);
        tree.setChildrenAllowed(menu[2]
, false);
        tree.setChildrenAllowed(menu[3]
, false);

        tree.setSelectable(true);
        tree.setMultiSelect(false);
        tree.select(menu[0]
); // this select works

        // Cause valueChange immediately when the user selects
        tree.setImmediate(true);

        // Expand whole tree
        for (Object id : tree.rootItemIds()) {
            tree.expandItemsRecursively(id);
        }

        return tree;
    }

    public void selectMenu() {
        navigationTree.setValue("Sub3"); // also tested with select

        // this is only for testing
        // Sub3 is the last item so if it is selected, b must be true
        boolean b = false;
        for (Object id : navigationTree.getItemIds()) {
            String a = id.toString();

            b = navigationTree.isSelected(id);
        }

        getMainWindow().showNotification(
                "test " + b + " - " + navigationTree.getValue().toString());
    }

Please try this out!

-Tepi

@teppo
i tried this out and it works
dont know why it doesn’t in my code

maybe i did a mistake in the css styles. i changed a littlebit
used a mix from the sampler+reeinder + the changes i did

i will check the differences and if i find the problem, i will post it here for other “newbies” :slight_smile:

but thx for helping…that’s a big plus for using vaadin

Ok,

i checked my application. It was my fault.
It has nothing to do with css or vaadin

for some reason i created two instances of my navigation class in witch the layout for the tree was created.
the first instance i showed within the splitpanel, in the other i tried to select the node. damn.

thats what you get, if you try to code “quick and dirty”

sorry for stealing your time
Mathias

hello together,

I have a similar problem to the one described above and here (http://dev.vaadin.com/ticket/11109).
I have a tree as a menu on the left side of my application and a content area on the right side. when i click an item in the tree, the view should change to the selected content page (which works).

however, what I haven’t figured out yet, is why the selected tree leaf/node (style with the .mytheme .v-tree-node-selected span } jumps seemingly randomly when I click on an item…no matter if I register the click with a vaueChangeListener or a clickListener.

my tree ist set to immediate.

any ideas?

Thanks in advance, dk

A few questions:
What do you mean by “jumps randomly”? Is it as described in the ticket? (“clicking on a tree node causes the tree to jump back to the currently selected tree item”)
Which Vaadin Version are you using?
Does it happen in all browsers?

Its like described in the upper part of the ticket (“randomly causes the current selection to bounce to a different leaf item. Sometimes a previous selection, sometimes the one just above the current selection”).

Happens in all browsers I tested (Firefox 26.0, Chrome 32, IE 10). My vaadin version is 7.1.9.

Can you try to create a simple test case to reproduce the problem? It seems like the ticket you mentioned failed because the Devs were not able to reproduce the problem. Try to build an app containing only the necessary code to reproduce the bug.
Maybe you even stumble over the issue while trying to create the test case.

ok I tried but with the same result…the current selected item ( styled with .mytheme .v-tree-node-selected span) randomly bounces to a different leaf or node.

import com.vaadin.data.Property;
import com.vaadin.navigator.*;
import com.vaadin.ui.*;
import javax.annotation.*;
import javax.inject.*;

public abstract class TestBaseView extends VerticalLayout implements View {

    @Inject
    Navigator navi;
    
    protected Tree treeNavigation;

    @Override
    public final void enter(ViewChangeListener.ViewChangeEvent event) {
        this.getUI().getPage().setTitle("vaadin tree test");
        onEnter(event);
    }

    @PostConstruct
    public void init() {
        CustomLayout basicLayout = new CustomLayout("html_layout);
        basicLayout.addComponent(getContent(), "location_content");
        basicLayout.addComponent(getNaviTree(), "location_navi");
        this.addComponent(basicLayout);
    }

    protected abstract Component getContent();

    protected abstract void onEnter(ViewChangeListener.ViewChangeEvent event);

    private Component getNaviTree() {
        treeNavigation = new Tree("menu");

        treeNavigation.addItem("home");
        treeNavigation.addItem("node a");
        treeNavigation.addItem("node b");
        treeNavigation.addItem("view A");
        treeNavigation.addItem("view B");

        treeNavigation.setParent("home", "menu");
        treeNavigation.setParent("node a", "menu");
        treeNavigation.setParent("node b", "menu");
        treeNavigation.setParent("view A", "node a");
        treeNavigation.setParent("view B", "node b");

        treeNavigation.addValueChangeListener(treeListener);
        treeNavigation.setImmediate(true);
        treeNavigation.expandItem("node a");
        treeNavigation.expandItem("node b");

        return treeNavigation;
    }

    Property.ValueChangeListener treeListener = new Property.ValueChangeListener() {

        @Override
        public void valueChange(Property.ValueChangeEvent event) {
            Object eventValue = event.getProperty().getValue();
            if (eventValue == null) {
                return;
            }

            switch (eventValue.toString()) {
                case "home":
                    navi.navigateTo("home");
                    break;
                case "node a":
                case "view A":
                    navi.navigateTo("view A");
                    break;
                case "node b":
                case "view B":
                    navi.navigateTo("view B");
                    break;
            }
        }
    };

}

example for a view file:

import com.vaadin.cdi.*;
import com.vaadin.navigator.*;
import com.vaadin.ui.*;

@CDIView(value = "view A")
public class TestViewA extends TestBaseView {

    private CustomLayout content;

    @Override
    protected Component getContent() {
        content = new CustomLayout("html_content_layout");
        content.addComponent(new Label("view A"), "location_name");
        return content;
    }

    @Override
    protected void onEnter(ViewChangeListener.ViewChangeEvent event) {
    }

}

I just made a small test .where i just took the Cod from the getNaviTree method which i thought would be enough to recreate your problem and added the tree directly to the main UI’s layout. Then i tested it and tried clicking just randomly on the nodes but i couldn’t see anything weird or buggy happening.
I tested on Vaadin 7.1.8, Tomcat 7.0.42 and Firefox 23.
I don’t know if that means that the problems might come from the navigator or if there is no real bug but could you try to create a new Project and then just go step by step adding the features of the current implementation until you get the issue you’re having right now. Maybe start by just a simple tree implementation and then add things like the listener, the navigator, …so on and so forth. Also try out maybe a different vaadin version for this project.