2011-05-24 66 views
0

我想構建MVC應用程序。ref在extjs4 mvc應用程序的控制器中不工作

以下是我的應用程序/控制器/ project.js的代碼文件

Ext.define('rt.controller.project', { 
extend: 'Ext.app.Controller', 

stores: ['project'], 
models: ['project'] , 
views: ['project.main', 'project.projectlist'], 

refs: [ 
     {ref: 'projectList', selector: 'projectlist'}, 
     {ref: 'projectData', selector: 'projectlist dataview'} 
     ], 


init: function() { 
    this.control({ 
     'projectlist dataview': { 
      selectionchange: this.loadProject 
     }, 
     'projectlist button[action=add]': { 
      click: this.addProject 
     }, 
     'projectlist button[action=remove]': { 
      click: this.removeProject 
     } 
    }); 
}, 

onLaunch: function() { 
    console.log(this.getProjectData()); 
    var dataview = this.getProjectData(), 
     store = this.getProjectStore(); 
    console.log("Stoer = " + store); 
    dataview.bindStore(store); 
    dataview.getSelectionModel().select(store.getAt(0)); 

}, 


loadProject: function(selModel, selected) { 

    console.log("Load Project"); 

}, 


addProject: function() { 
    console.log("Add Project"); 
}, 

removeProject: function() { 
    console.log("Remove Project"); 
}, 


}); 

以下是我的應用程序/視圖/項目代碼/ projectlist.js

Ext.define('rt.view.project.projectlist', { 
extend: 'Ext.panel.Panel', 
alias: 'widget.projectlist', 

requires: ['Ext.toolbar.Toolbar'], 

title: 'Projects', 
collapsible: true, 
animCollapse: true, 
margins: '5 0 5 5', 
layout: 'fit', 

initComponent: function() { 
    Ext.apply(this, { 
     items: [{ 
      xtype: 'dataview', 
      trackOver: true, 
      store: this.store, 
      cls: 'project-list', 
      itemSelector: '.project-list-item', 
      overItemCls: 'project-list-item-hover', 
      tpl: '<tpl for="."><div class="project-list-item">{name}</div></tpl>', 
      listeners: { 
       selectionchange: this.onSelectionChange, 
       scope: this 
      } 
     }], 

     dockedItems: [{ 
      xtype: 'toolbar', 
      items: [{ 
       text: 'Add project', 
       action: 'add' 
      }, { 
       text: 'Remove project', 
       disabled: true, 
       action: 'remove' 
      }] 
     }] 
    }); 

    this.callParent(arguments); 
}, 

onSelectionChange: function(selmodel, selection) { 
    var selected = selection[0], 
     button = this.down('button[action=remove]'); 
    if (selected) { 
     button.enable(); 
    } 
    else { 
     button.disable(); 
    } 
} 
}); 

當我跑我的應用程式它顯示以下錯誤

數據視圖未定義

在文件控制器

/上線34 project.js這是繼

dataview.bindStore(store); 

似乎以下未在控制器代碼

refs: [ 
    {ref: 'projectList', selector: 'projectlist'}, 
    {ref: 'projectData', selector: 'projectlist dataview'} 
], 

工作沒有任何一個有什麼可能導致的任何想法這個?

讓我知道你是否需要更多信息。

回答

1

我有類似的問題引用dataview。這裏是我如何修改我的選擇器字符串:

{ref: 'projectData', selector: 'projectlist > dataview' } 

這應該解決它。但是我想問你在控制檯上顯示onLaunch方法中的console.log(this.getProjectData());?另外,我沒有看到一個ref爲projectStore這樣您就可以執行以下命令:

store = this.getProjectStore(); 

你錯過在refs列表中projectStore參考?

+0

Hello Abdel,謝謝你的回覆。我似乎解決了它。問題是應用程序初始化時'projectlist'視圖不在視口中。我點擊桌面上的圖標啓用它。 所以我把事件放在我的控制器'projectlist'中:{render:this.onRenderList}和onRenderList函數中,我放置了onLaunch函數的代碼。所以現在看起來好了 – amar4kintu 2011-05-24 07:20:04

+0

關於projectStore,不應該自動創建嗎?我的app/store/project.js中有項目存儲文件。我正在從示例文件夾中給出的feed查看器應用程序的示例執行此操作。在那裏他們沒有采取任何這樣的裁判,它似乎工作正常。讓我知道如果我錯了。謝謝 – amar4kintu 2011-05-24 07:23:44

+0

毫米..是的..我忽略了:)你是正確的..有沒有需要參考商店 – 2011-05-24 07:32:44

相關問題