1. #1
    Sencha User
    Join Date
    Oct 2010
    Posts
    18
    Vote Rating
    0
    bobestjs is on a distinguished road

      0  

    Default Help migrate tree code from 3.4 to 4.1

    Hi,

    Can someone show me what this code would look like in EXTJS 4.1

    Thanks



    Ext.onReady(function () {
    toc = new Ext.tree.TreePanel({
    renderTo: 'toc_div',
    useArrows: true,
    animate: true,
    border: false,
    rootVisible: true,
    width: 300,
    height: 300,
    enableDD: false,
    // listeners: { 'checkchange': updateLayerVisibility },
    selModel: new Ext.tree.MultiSelectionModel(),
    bodyStyle: 'background-color:#d6d6e0;',
    id: 'toc',
    root: new Ext.tree.TreeNode(
    { text: 'AOIs and Products List',
    draggable: false,
    id: 'CMB Online',
    expanded: true
    })
    });

    toc.getRootNode().expand();

    xxx = toc.getNodeById("CMB Online");
    newNode = new Ext.tree.TreeNode({ id: "Product Catalog", text: "Product Catalog", layerId: 5, name: "Product Catalog", layerType: "Group Layer", parentLayerId: -1, parentName: "Root", rootLayerId: 5, rootName: "Product Catalog", inCart: false });
    xxx.appendChild(newNode);
    xxx = toc.getNodeById("Product Catalog")
    xxx.expand();

    xxx = toc.getNodeById("Product Catalog");
    newNode = new Ext.tree.TreeNode({ id: "CADRG", text: "CADRG", layerId: 83, name: "CADRG", layerType: "Group Layer", parentLayerId: 5, parentName: "Product Catalog", rootLayerId: 5, rootName: "Product Catalog", inCart: false });
    xxx.appendChild(newNode);

    xxx = toc.getNodeById("CADRG");
    newNode = new Ext.tree.TreeNode({ id: "CMB_RPF_MISC_MAPS", text: "CMB_RPF_MISC_MAPS", icon: "Images/TOC/084CMB_RPF_MISC_MAPS.png", checked: false, layerId: 84, name: "CMB_RPF_MISC_MAPS", layerType: "Feature Layer", parentLayerId: 83, parentName: "CADRG", rootLayerId: 5, rootName: "Product Catalog", inCart: false });
    xxx.appendChild(newNode);

    xxx = toc.getNodeById("CADRG");
    newNode = new Ext.tree.TreeNode({ id: "CMB_RPF_MIL_INSTL", text: "CMB_RPF_MIL_INSTL", icon: "Images/TOC/085CMB_RPF_MIL_INSTL.png", checked: false, layerId: 85, name: "CMB_RPF_MIL_INSTL", layerType: "Feature Layer", parentLayerId: 83, parentName: "CADRG", rootLayerId: 5, rootName: "Product Catalog", inCart: false });
    xxx.appendChild(newNode);


    }); // end function

  2. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    9,263
    Vote Rating
    486
    scottmartin has a reputation beyond repute scottmartin has a reputation beyond repute scottmartin has a reputation beyond repute scottmartin has a reputation beyond repute scottmartin has a reputation beyond repute scottmartin has a reputation beyond repute scottmartin has a reputation beyond repute scottmartin has a reputation beyond repute scottmartin has a reputation beyond repute scottmartin has a reputation beyond repute scottmartin has a reputation beyond repute

      0  

    Default

    Have you reviewed the API for the tree in 4.1? Are you having problems with something in particular?

    Scott.

  3. #3
    Sencha User
    Join Date
    Oct 2010
    Posts
    18
    Vote Rating
    0
    bobestjs is on a distinguished road

      0  

    Default

    I found out what I needed my main problem is how to hide a node

    This is how I did it 3.4


    var ui = n.getUI();
    ui.hide();

    Any ideas?

    -Bob

  4. #4
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    9,263
    Vote Rating
    486
    scottmartin has a reputation beyond repute scottmartin has a reputation beyond repute scottmartin has a reputation beyond repute scottmartin has a reputation beyond repute scottmartin has a reputation beyond repute scottmartin has a reputation beyond repute scottmartin has a reputation beyond repute scottmartin has a reputation beyond repute scottmartin has a reputation beyond repute scottmartin has a reputation beyond repute scottmartin has a reputation beyond repute

      0  

    Default

    See if the following code will work for you:

    Code:
    var store = Ext.create('Ext.data.TreeStore', {
        root: {
            expanded: true,
            children: [
                { text: "detention", leaf: true },
                { text: "homework", expanded: true, children: [
                    { text: "book report", leaf: true },
                    { text: "alegrbra", leaf: true}
                ] },
                { text: "buy lottery tickets", leaf: true }
            ]
        }
    });
    
    Ext.create('Ext.tree.Panel', {
        title: 'Simple Tree',
        width: 200,
        height: 150,
        store: store,
        rootVisible: false,
        renderTo: Ext.getBody(),
        tbar: [{
            text: "Hide Selected",
            handler: function(btn) {
                var tree = btn.up("treepanel"),
                    view = tree.getView(),
                    selectedNode = tree.getSelectionModel().getSelection()[0],
                    el = Ext.fly(view.getNodeByRecord(selectedNode));
                
                el.setVisibilityMode(Ext.Element.DISPLAY);
                el.setVisible(false);
            }
        }]
    });​
    Scott.

Thread Participants: 1

Tags for this Thread