Hybrid View

  1. #1
    Sencha User
    Join Date
    Oct 2012
    Posts
    9
    Vote Rating
    0
    akshayrpin is on a distinguished road

      0  

    Default Answered: Add Checkbox for Selected TreeItem [com.extjs.gxt.ui.client.widget.tree.TreeItem]

    Answered: Add Checkbox for Selected TreeItem [com.extjs.gxt.ui.client.widget.tree.TreeItem]


    Hi all,


    I tried to google but i was not able to find how to add a checkbox for a selected node in a tree.


    By making Tree.setCheckable(true); will show a checkbox for all the parent and child node, my requirement is to have check box for only those node whose status is satisfied,


    Thank you in Advance
    Aks

  2. TreePanel.setChecked governs the ability to check items, as well as the actual firing of events and informing the dom to do the work. Its default implementation makes sure the default options (Leaf-only, node-only, or all) are followed with this code:

    Code:
          if ((!leaf && checkNodes == CheckNodes.LEAF) || (leaf && checkNodes == CheckNodes.PARENT)) {
            return;
          }
    Overriding this method and providing nearly the same functionality would be tricky, as there are a number of private variables - it could be done, but you'd need lots of JSNI to accomplish this.

    Instead, take a look at the events fired as part of this process. When a Before- event is fired, this gives listening code the chance to stop whatever is happening by invoking .setCanceled(true);

    How does this help you? There is a BeforeCheckChange event that goes off prior to actually checking the items - if you listen to this, you can customize the behavior of what is allowed to be checked. To make this work correctly, allow all nodes to be checked (using setCheckNodes), then implement your "can the user check this?" logic in your BeforeCheckChange listener.

  3. #2
    Sencha - GXT Dev Team
    Join Date
    Feb 2009
    Location
    Minnesota
    Posts
    2,731
    Answers
    109
    Vote Rating
    90
    Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light

      0  

    Default


    You are referring to the Tree class which is deprecated in 2.x, but you are posting in the 2.x forums - are you referring to the GXT 2.x Tree class?

    In both GXT 2.x TreePanel and GXT 3.x Tree you can call

    Code:
    treeWidget.setCheckable(true);
    treeWidget.setCheckNodes(CheckNodes.LEAF);//or PARENT or BOTH
    to configure which kind of node can be selected.

    Does this answer your question? If not, can you be more specific about which version and which class you are using?

  4. #3
    Sencha User
    Join Date
    Oct 2012
    Posts
    9
    Vote Rating
    0
    akshayrpin is on a distinguished road

      0  

    Default


    Hi,


    treeWidget.setCheckNodes(CheckNodes.LEAF);//or PARENT or BOTH this would enable the checkbox for all the leaf node / parent or both

    is it possible to add to only seleted item of the leaf node, which satifies certain condition ???

  5. #4
    Sencha - GXT Dev Team
    Join Date
    Feb 2009
    Location
    Minnesota
    Posts
    2,731
    Answers
    109
    Vote Rating
    90
    Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light

      0  

    Default


    Not without knowing what version and what class you are trying to use...

    Your title talks about 'com.extjs.gxt.ui.client.widget.tree.TreeItem', your post talks about 'Tree', but the only tree-like widget that exists in 2.x and should still be used is called TreePanel. The others are deprecated, and should be avoided, especially in any new code.

    If I assumed you actually meant the 3.x Tree class, then I could give you one answer, but it wouldn't work for 2.x's deprecated Tree/TreeItem types.

  6. #5
    Sencha User
    Join Date
    Oct 2012
    Posts
    9
    Vote Rating
    0
    akshayrpin is on a distinguished road

      0  

    Default


    i am using TreePanel and populating with treeStore.

    i have enabled

    store = new TreeStore<BeanModel>(createStore());
    treePanel = new TreePanel<BeanModel>(store);
    //treePanel.setCaching(false);
    treePanel.setDisplayProperty(NODE);
    treePanel.setCheckable(true);
    treePanel.setCheckNodes(CheckNodes.LEAF);
    treePanel.setAutoLoad(true);
    treePanel.setLabelProvider(new ModelStringProvider<BeanModel>() {

    @Override
    public String getStringValue(BeanModel model, String property) {
    MyObj cf = model.getBean();
    String fieldName = "menu.item.";
    return Messages.getMessage(fieldName, cf.getXmlName());
    }
    });

  7. #6
    Sencha - GXT Dev Team
    Join Date
    Feb 2009
    Location
    Minnesota
    Posts
    2,731
    Answers
    109
    Vote Rating
    90
    Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light

      0  

    Default


    TreePanel.setChecked governs the ability to check items, as well as the actual firing of events and informing the dom to do the work. Its default implementation makes sure the default options (Leaf-only, node-only, or all) are followed with this code:

    Code:
          if ((!leaf && checkNodes == CheckNodes.LEAF) || (leaf && checkNodes == CheckNodes.PARENT)) {
            return;
          }
    Overriding this method and providing nearly the same functionality would be tricky, as there are a number of private variables - it could be done, but you'd need lots of JSNI to accomplish this.

    Instead, take a look at the events fired as part of this process. When a Before- event is fired, this gives listening code the chance to stop whatever is happening by invoking .setCanceled(true);

    How does this help you? There is a BeforeCheckChange event that goes off prior to actually checking the items - if you listen to this, you can customize the behavior of what is allowed to be checked. To make this work correctly, allow all nodes to be checked (using setCheckNodes), then implement your "can the user check this?" logic in your BeforeCheckChange listener.

Thread Participants: 2