1. #1
    Sencha User luisparada's Avatar
    Join Date
    Nov 2007
    Location
    Venezuela
    Posts
    94
    Answers
    2
    Vote Rating
    2
    luisparada is on a distinguished road

      0  

    Default Unanswered: How to return the selected item on a dinamically builded treepanel ??

    Unanswered: How to return the selected item on a dinamically builded treepanel ??


    I have an issue trying to get the selected item of my treepanel, which is filled from a treestore by ajax. When I try treepanel = Ext.getCmp('tree').getSelectionModel().getSelection() it returns [] also with getSelected() returns [] and is basically the same with all methods I use to get the selected child., the node childs are inside the root node which is hidden, here is my treepanel code:
    Code:
    Ext.define('AvlSystem.view.menu.VehiculosAsignados' ,{
        extend: 'Ext.tree.Panel',
        alias : 'widget.assignedvehiclesmenu',
        
        border:false,
        rootVisible:false,
        autoScrol:true,
    
        initComponent: function() {
            this.id = 'assigned-vehicles-panel';
    
            this.title = 'Vehiculos Asignados';
            
            this.store = 'AssignedVehicles';
            
            this.useArrows = true;
            
            this.frame = true;
            
            this.selModel = {
                mode:'SINGLE'
            }
            
            var states = Ext.create('Ext.data.Store', {
                fields: ['abbr', 'name'],
                data : [
                    {"action":"ONLINE", "name":"Conectado"},
                    {"action":"OFFLINE", "name":"No Disponible"},
                    {"action":"DISCONNECTED", "name":"Desconectado"},
                    {"action":"NEVERCONN", "name":"Nunca Conectado"}
                ]
            });
            
            var combo = Ext.create('Ext.form.field.ComboBox', {
                editable:false,
                hideLabel: true,
                store: states,
                displayField: 'name',
                valueField:'action',
                typeAhead: false,
                queryMode: 'local',
                triggerAction: 'all',
                emptyText: 'Mostrar',
                selectOnFocus: true,
                width: 90,
                iconCls: 'no-icon'
            });
            
            var orderButton = Ext.menu.Menu({
                autoWidth:true,
                autoHeight:true,
                floating: false,
                autoRender:true,
                items:[{
                    id:'add-geocerca-id',
                    text:'Crear Geocerca'
                },{
                    id:'delete-geocerca-id',
                    text:'Eliminar Geocerca'
                }]
            });
            
            this.dockedItems = [{
                id:'main-commands-toolbar',
                xtype:'toolbar',
                items:['->',combo,{
                    text:'Geocercas',
                    iconCls:'geofence',
                    menu:[{
                            id:'add-geocerca-id',
                            text:'Crear Geocerca'
                        },{
                            id:'delete-geocerca-id',
                            text:'Eliminar Geocerca'
                        }]
                    }]
            }];
            
            this.listeners = {
                itemclick:function(el,ind){
                    var mainpanel = Ext.getCmp('main-center-panel').setActiveTab(0);
                    var gmap = Ext.getCmp('gmap-base');
                    var mapa = Ext.getCmp('gmap-base').getMap();
                    var darwin = new google.maps.LatLng(ind.data.googlelat,ind.data.googlelong);
                    mapa.setZoom(16);
                    mapa.setCenter(darwin);
                    gmap.lastCenter = darwin;
                },
                select:function(el,ind){
                    if(Ext.getCmp('commands-options-menu')){
                        Ext.getCmp('main-commands-topmenu').enable();
                        store = Ext.getStore('commands-menu-store');
                        store.removeAll(true);
                        store.load({
                            params:{
                                imei:ind.data.imei
                            }
                        });
                    }
                }
            };
            
            this.callParent(arguments);
        }
    });
    and here is my controller:
    Code:
    Ext.define('AvlSystem.controller.Commands', {
        extend: 'Ext.app.Controller',
        views:['menu.Comandos','menu.VehiculosAsignados'],
        refs:[{
            ref:'tree',
            selector:'assignedvehiclesmenu'
        }],
        init: function() {
            this.control({
                'commandsmenu':{
                    click:this.sendCommand
                }
            })
        },
        sendCommand:function(view, record, item, index){
            form = Ext.create('Ext.form.Panel',{
                    url: '/index.php/AvlComandosQueue/sendCommand',
                    frame:true,
                    border:false,
                    autoWidth:true,
                    autoHeight:true,
                    items:[{
                        id:'password',
                        xtype:'textfield',
                        inputType:'password',
                        fieldLabel:'Password',
                        allowBlank:false
                    }],
                    buttons: [{
                        id:'form-submit-id',
                        text: 'Submit',
                        listeners:{
                            click:function(el){
                                    treepanel = Ext.getCmp('assigned-vehicles-panel').getSelectionModel().selected.items;
                                    console.log(treepanel);
                                    var form = this.up('form').getForm();
                                    if (form.isValid()) {
                                        var pass = (this.up('form').down('#password'));
                                        var crypted = (hex_md5(pass.getValue()));
                                        pass.setValue(crypted);
                                        form.submit({
                                            success: function(form, action) {
                                                console.log('listo')
                                            },
                                            failure: function(form, action) {
                                                pass.reset();
                                                Ext.Msg.alert('Error', action.result.Msg);
                                            }
                                        });
                                    }
                                }
                        }
                    }]
            })
            
            win = Ext.create('Ext.window.Window',{
                    height:100,
                    width:300,
                    closable:true,
                    title: 'Credenciales',
                    items:[form]
            });
            
            win.show();
        }
    });
    Can anyone help me on this ???
    ____________________________________
    do not make install, just compile it.!!!
    --------------------------------------------------
    //*************k4m1k4z3************\\

  2. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    8,872
    Answers
    652
    Vote Rating
    438
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    This works for me:

    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 }
            ]
        }
    });
    
    var tree = Ext.create('Ext.tree.Panel', {
        title: 'Simple Tree',
        width: 200,
        height: 150,
        store: store,
        rootVisible: false,
        renderTo: Ext.getBody()
    });
    
    Ext.create('Ext.Button', {
        text: 'Click me',
        renderTo: Ext.getBody(),
        handler: function() {
            var sm = tree.getSelectionModel();
            var sel = sm.getSelection();
            
            console.log(sm);
            console.log(sel);
            console.log(sel[0].data.text); // displays 'book report' if selected
        }
    });
    Regards,
    Scott.

Thread Participants: 1

Tags for this Thread