Itemclick and itemmove in EXTJS MVC

Question

Am having a tree panel in my view, and its corresponding controllers. What is happening is that am having two controllers, one for the itemdblclick and another for itemmove. The itemdblclick is working ok, but when i add the controller for itemmove, itemmove is working, but on the other hand, itemdbclick is not working. And if i remove the itemmove controller, itemdblclick is working. Hope am not confusing:) In simple words, the two controllers are working separately but not together.

Could anyone please tell me what am i doing wrong here.
Also, in the function editRegion in the controller, am trying to reload the tree by using the getStore.load() method, but the tree is not loading even though am able to see the store being invoked in the firebug

EDIT:

Am opening a form on double-clicking the tree node, and on closing the form, i want the tree panel to be reloaded. This is what i want to happen in editregion function

View

{
            xtype : 'treepanel',
            title : '',
            id : 'hierarchyTree',
            border : false,
            alias : 'widget.hierarchyTree',
            height : 1000,
            viewConfig : {
                enableDD : true,
                plugins : {
                    ptype : 'treeviewdragdrop'
                }
            },
            collapsible : false,
            useArrows : true,
            rootVisible : false,
            store : Ext.create('App.store.HierarchyTree'),
            displayField : 'Title',
            multiSelect : false,
            singleExpand : false,


        }

Controller

refs : [{
    ref : 'myHierarchyTree',
    selector : '#hierarchyTree'
}
    init : function() {

    this.getHierarchyTreeStore().load();

'#hierarchyTree' : {
            itemdblclick : this.itemdblclick

        },
        '#hierarchyTree' : {
            itemmove : this.itemmove

        }

itemdblclick : function(view, record, level) {


    if (record.get('LevelID') == 1) {

        this.erWin = Ext.create('App.view.EditRegions');
        var f = this.getEditregionform().getForm();
        f.loadRecord(record);
        this.erWin.showWin();
    } 
else if (record.get('LevelID') == 2) {

        this.eaWin = Ext.create('App.view.EditAreas');
        var f = this.getEditareaform().getForm();
        f.loadRecord(record);
        this.eaWin.showWin();
    }

itemmove : function(v, oldParent, newParent, index, eOpts) {
    var nodeID = v.data.id;
    var oldParent = oldParent.data.id;
    var newParent = newParent.data.id;
    var index = index;
    var level = v.data.LevelID;

Ext.Ajax.request({
        url : 'data/Locations.aspx',
        params : {

            mode : 'MOVENODE',
            currentNode : nodeID,
            oldParentNode : oldParent,
            newParentNode : newParent

        },
        success : function() {
            alert(LANG.SUC);
            Ext.getStore('HierarchyTree').load();

        },
        failure : function() {

        }
    });


editRegion : function(button, record) {

    var fp = button.up('form');

    if (fp.getForm().isValid()) {
        fp.getForm().submit({
            url : 'data/Locations.aspx',
            params : {
                mode : 'EDITREGION',
                userID : ME.UserID,
                RegionID : ME.RegionID
            },
            success : function(response) {
                alert(LANG.SUC);
                this.getHierarchyTreeStore().load();


            },
            failure : function(response) {
                alert('Try again');
            }
        });
    }
}

nscrob · Accepted Answer · 2012-09-07T15:24:25.413

1

adding them separately will cause the first listener object to be overridden.

Fix:

       '#hierarchyTree' : {
            itemdblclick : this.itemdblclick,
            itemmove : this.itemmove
        },

You should check if the store is the same. Meaning check the id because i think the contoller initializes one store and the panel another. so check if this.getHierarchyTreeStore().id is equal with the one from treepanel. you can navigate to it from the button something like button.up().down('treepanel').getStore().id. If they are different then you should use the second method to get the store.

edited Sep 07 '12 at 15:24

answered Sep 07 '12 at 15:14

nscrob

4,483
1
20
24

it worked again:) thank you so much:) and any ideas on the second question – rosebrit3 Sep 07 '12 at 15:17

score 0 · Answer 2 · answered Sep 07 '12 at 16:02

0

tried doing the following code, as using up and down will not refer to the correct view, since the tree and the forms are completely different views

    var view = Ext.widget('hierarchy');
view.down('treepanel').getStore.load();

Now, even though the store is re-loading, am geting an error

TypeError: view.down("treepanel") is null

view.down('treepanel').getStore.load();

answered Sep 07 '12 at 16:02

rosebrit3

523
1
18
32

1

ext widget is actualy creating a new component, so don't use that when you try to find treepanel. For completely diferent views you can use Ext.ComponentQuery.query('hierarchy') or Ext.getCmp('hierarchy') – nscrob Sep 07 '12 at 17:19
@rosebrit3 please dont use stackoverflow like a forum. If your question is answered and you have another check it or if you have to update your initial post. And don't to marks the right answer as answer ;-) – sra Sep 07 '12 at 18:05

Itemclick and itemmove in EXTJS MVC

2 Answers2