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,634
    Answers
    107
    Vote Rating
    80
    Colin Alworth is just really nice Colin Alworth is just really nice Colin Alworth is just really nice Colin Alworth is just really nice Colin Alworth is just really nice

      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,634
    Answers
    107
    Vote Rating
    80
    Colin Alworth is just really nice Colin Alworth is just really nice Colin Alworth is just really nice Colin Alworth is just really nice Colin Alworth is just really nice

      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,634
    Answers
    107
    Vote Rating
    80
    Colin Alworth is just really nice Colin Alworth is just really nice Colin Alworth is just really nice Colin Alworth is just really nice Colin Alworth is just really nice

      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.

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

      0  

    Default


    thank you colin
    my requirement is not to show up checkbox if the condition is not satisfied, but i guess i will have to show up some message when users tries to check by using BeforeCheckChange.

    thank you for your reply.

    could you please help me out with my other Post. "ReOrdering of child nodes within the parent"

  9. #8
    Sencha - GXT Dev Team
    Join Date
    Feb 2009
    Location
    Minnesota
    Posts
    2,634
    Answers
    107
    Vote Rating
    80
    Colin Alworth is just really nice Colin Alworth is just really nice Colin Alworth is just really nice Colin Alworth is just really nice Colin Alworth is just really nice

      0  

    Default


    My apologies - I answered the wrong question. I'm glad the fix I provided works for you, because the real fix is a little worse.

    The rendering is managed by com.extjs.gxt.ui.client.widget.treepanel.TreePanelView.getTemplate(ModelData, String, String, AbstractImagePrototype, boolean, boolean, Joint, int, TreeViewRenderMode). The flag 'checkable' is used to decide whether or not to render the checkbox.

    It could be possible to subclass TreePanelView, and override getTemplate, and decide whether or not you can render a checkbox , then pass that value to super.getTemplate. Something like this:

    Code:
    public ConditionalCheckTreePanelView extends TreePanelView {
        public String getTemplate(ModelData m, String id, String text, 
                    AbstractImagePrototype icon, boolean ignore, boolean checked,
                    Joint joint, int level, TreeViewRenderMode renderMode) {
            boolean checkable = canBeChecked(m);
            return super.getTemplate(m, id, text, icon, checkable, checked,
                        joint, level, renderMode);
        }
    }
    This is untested. You'll need, as in the original example, to set checkNodes to ALL.

  10. #9
    Sencha User
    Join Date
    Dec 2012
    Posts
    4
    Vote Rating
    0
    urry_buh is on a distinguished road

      0  

    Default I'm understood nothing :-(

    I'm understood nothing :-(


    I' just novice in Ext.
    My task now is to set checkboxes visible, when no "checked" params in json data(see example) setted.
    The idea was to use treePanel's "load" event and just write something about
    ...... treePanel definition......
    ......................
    load: function(node){
    if(typeof node.checked != 'undefined'){
    node.checked = false;
    return;
    }
    node.checked = true;
    }
    ........
    Data in check-tree.json stays unchanged
    Suggested:
    Branches in example will be visible with empty checkboxes
    leafs wil be set to checked
    BUT:
    IE debugger show this code is never called.
    all checkboxes in the sampe stays unchecked

    What is wrong?! I can't understand? but even "checkchange" listener from example is not calling from debugger, but check boxes are functioning!
    Can somebody help me?
    if you can FULL code, please
    Gteat thanks for All

  11. #10
    Sencha - GXT Dev Team
    Join Date
    Feb 2009
    Location
    Minnesota
    Posts
    2,634
    Answers
    107
    Vote Rating
    80
    Colin Alworth is just really nice Colin Alworth is just really nice Colin Alworth is just really nice Colin Alworth is just really nice Colin Alworth is just really nice

      0  

    Default


    Unfortunately, this discussion forum is for GXT, which uses Java - we don't write much JavaScript. You'll have better luck in one of the forums that are specific to Ext JS.

Thread Participants: 2

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar