Results 1 to 2 of 2

Thread: TreePanel using DataStore data

  1. #1
    Ext User
    Join Date
    Dec 2009
    Location
    Arlington, VA
    Posts
    2

    Post TreePanel using DataStore data

    Is there a way I can build a tree using a data store? I am building the data store using a JSON element, then I was hoping I would be able to make the tree by using the data within the data store. I then could use one data store for multiple things, the only way I can think of doing it right now is by walking the data store and building the tree manually, but the data store is going to be updating frequently. With all of the updates it makes walking the store too slow.

    Thanks!

  2. #2

    Default

    You are welcome to pick over the bones of what I figured out and have used as a tree menu in my app...
    The leaf node in each branch of the tree causes a javascript application to be loaded into a new tab within the center region of my panel layout and then eval'ed to cause it to run.
    PHP Code:
             // --------------------------------------------------------------------------------------------
             // Create an object reference variable to TreeLoader object load the menu used in the left bar          
             // --------------------------------------------------------------------------------------------         
             
    var NavTreeLoader =new Ext.tree.TreeLoader({
                        
    url'a url that supplies your json tree data',
                      });          
             
    // ------------------------------------------------------------------------------------------
             // Create an object reference variable to TreePanel object to be used as the left menu bar          
             // ------------------------------------------------------------------------------------------                           
             
    var NavTreePanel = new Ext.tree.TreePanel({
             
    //var NavTreePanel = new Ext.ux.TreePanelStateful({
                      
    id'NavTreePanel',                       
                      
    statefultrue,
                      
    stateId:'UserTree',
                      
    cpcp,
                      
    autoScrolltrue,
                      
    splittrue,
                      
    borderfalse,
                      
    animatetrue,
                      
    //plugins: [ new Ext.ux.plugins.TreePanelStateful()],                
                      //expanded: true,
                      
    loaderNavTreeLoader,
                      
    root: new Ext.tree.AsyncTreeNode(),
                      
    rootVisiblefalse,
                      
    listeners: {
                          
    click: function(tree_xhr) {
                              
    Ext.Ajax.request({
                                
    // A server side script used to add tabs to the CenterTabPanel and place component objects in them
                                 
    url'index.php',                                 
                                 
    params: {
                                     
    optiontree_xhr.attributes.option
                                     
    controllertree_xhr.attributes.controller
                                     
    tasktree_xhr.attributes.task,
                                     
    viewtree_xhr.attributes.view,
                                     
    layouttree_xhr.attributes.layout,
                                     
    formattree_xhr.attributes.format
                                 
    },
                                 
    success: function(comp_xhr) {
                                     var 
    newComponent = eval(comp_xhr.responseText); // create component 
                                     
    newTab CenterTabPanel.add(newComponent);      // add it to a new tab
                                     
    CenterTabPanel.setActiveTab(newComponent);      // make the new tab active
                                 
    },
                                 
    failure: function(responseoptions) {
                                     
    Ext.Msg.alert("Failed to load code for CenterTabPanel""Server communication failure:");
                                 } 
                              }) 
                          }
                      }               
             }); 
    The JSON for the tree looks like this (I am developing withing a Joomla CMS component, hence the odd references in the baseparms to steer joomla toward the correct code to give me)
    PHP Code:
    <?php
    //header ("content-type: text/xml");
    header("Cache- Control: no-cache, must-revalidate" ); // HTTP/1.1
    header("Expires: Mon, 26 Jul 1997 05:00:00 GMT"); // Date in the past
    $menu_list "
    [  
    {
        text: 'Clients',
        id: 'Clients',
        leaf: false,
        children: [
        {
            text: 'Company',  
            id: 'Companies',
            leaf: false,
            children: [
            {    
                text: 'List',
                id: 'ListCompanies',        
                leaf: true,
                option: 'com_opsuk-backoffice',
                view: 'client_companies', 
                layout: 'listClientCompaniesConfig',
                format: 'raw'                
            },{
                text: 'Edit',
                id: 'EditCompanies',         
                leaf: true,
                option: 'com_opsuk-backoffice',
                view: 'client_companies', 
                layout: 'editClientCompaniesConfig',
                format: 'raw'
            }]       
        },{
            text: 'Contacts',  
            id: 'Contacts',
            leaf: false,
            children: [
            {    
                text: 'List',
                id: 'ListContacts',        
                leaf: true,
                option: 'com_opsuk-backoffice',
                view: 'client_contacts', 
                layout: 'listClientContactsConfig',
                format: 'raw'                
            },{
                text: 'Edit',
                id: 'EditContacts',         
                leaf: true,
                option: 'com_opsuk-backoffice',
                view: 'client_contacts', 
                layout: 'editClientContactsConfig',
                format: 'raw' 
            }]      
        }]                         
    }, {
        text: 'Bookings',
        id: 'Bookings',    
        leaf: true
    }, {
        text: 'Events',
        id: 'Events',    
        leaf: true
    }, {
        text: 'Venues',
        id: 'Venues',    
        leaf: true
    }, {
        text: 'Persons',
        id: 'Persons',
        leaf: false,
        children: [{
            text: 'List',
            id: 'ListPersons',        
            leaf: true,
            option: 'com_opsuk-backoffice',
            view: 'persons', 
            layout: 'listConfig',
            format: 'raw'                
        },{
            text: 'Edit',
            id: 'EditPersons',         
            leaf: true,
            option: 'com_opsuk-backoffice',
            view: 'persons', 
            layout: 'editConfig',
            format: 'raw'                    
        }]                                                        
    }, {
        text: 'Employees',
        id: 'Employees',    
        leaf: false,
        children: [{
            text: 'List',
            id: 'ListEmployees',        
            leaf: true,
            option: 'com_opsuk-backoffice',
            task: 'employee_grid', 
            //controller: 'employees',
            view: 'employees', 
            layout: 'listConfig',
            format: 'raw'                
        }, {
            text: 'Worksheets',
            leaf: true,
            task: 'employee_worksheets'
        }]                                                    
    }, {
        text: 'Events',
        leaf: true
    }
    ]
    "
    ;
    echo 
    $menu_list;
    ?>
    Not sure if that helps...

    Good luck,
    Nick.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •