我正在创建一个 ExtJS 5.1.1 演示应用程序。尝试给gridpanel一个刷新按钮refs
,这样我就可以设置一个函数来重新加载网格内的数据。
我想我无法refs
为网格面板和刷新按钮创建正确的。因此点击事件不起作用。
主视图:
Ext.define('MultiDB.view.DBMainView', {
extend: 'Ext.container.Viewport',
alias: 'widget.dbmainview',
requires: [ ... ],
initComponent: function () {
var me = this;
Ext.apply(me, {
items: [{
xtype: 'dbmenupanel',
region: 'west'
}, {
xtype: 'dbgridpanel',
region: 'center'
}, {
xtype: 'dbformpanel',
region: 'south'
}]
});
me.callParent();
}
});
网格面板:
Ext.define('MultiDB.view.DBGridPanel', {
extend: 'Ext.grid.Panel',
xtype: 'dbgridpanel',
store: 'FolioStore',
requires: [...],
title: 'ORest DB List',
padding: 1,
itemId: 'gridPanel',
dockedItems: [...],
initComponent: function () {
var me = this;
Ext.apply(me, {
tools: [{
type: 'refresh',
itemId: 'refreshBtn',
tooltip: 'Refresh the DB',
//handler: function () {alert('Click: Refresh Btn');}
}],
columns: [...]
});
me.callParent();
}
});
控制器:
Ext.define('MultiDB.controller.DBMainController', {
extend: 'Ext.app.Controller',
views: ['DBGridPanel'],
refs: {
formPanel: 'dbformpanel#formPanel',
gridPanel: 'dbgridpanel#gridPanel',
mainView: 'dbmainview#mainView',
registrationBtn: 'splitbutton#registrationBtn',
refreshBtn: 'dbmainview dbgridpanel#refreshBtn'
},
init: function (application) {
this.control({
"menuitem[opt]": {
click: this.setFormPanel
},
"dbmainview dbgridpanel#refreshBtn": {
viewready: this.doRefresh
}
});
},
setFormPanel: function (item) {...},
doRefresh: function () {
console.log('this is doInit!');
this.getGridPanel().getStore().load();
}
});