我有一个父类和子类,如下所述。
Ext.ns("MyUi");
MyUi.ParentPanel = Ext.extend(Ext.form.FormPanel, {
initComponent: function() {
MyUiPanel.superclass.initComponent.call(this);
},
id: 'card-id',
layout: 'card',
activeItem: 0,
buttonAlign: 'center',
buttons:[{
text: "Next",
id: "card-next",
handler: function(){
Ext.getCmp('card-id').navigationHandler(1);
}
},{
text: "Previous",
id: "card-prev",
handler: function(){
Ext.getCmp('card-id').navigationHandler(-1);
},
disabled: true
},{
text: "Finish",
id: "finishButton",
}],
navigationHandler: function(increment){
//code to switch cards/items
}});
var panel1 = ...
var panel2 = ...
childPanel = Ext.extend(MyUi.ParentPanel, {
initComponent: function() {
var items = [panel1, panel2];
Ext.apply( this, {
items: items
});
Cx.Ui.ProvisionRPoolWizardPanel.superclass.initComponent.apply(this);
}
});
我希望我的子面板覆盖父面板按钮名称和处理程序。
例如,我想在子面板中使用名为“Complete”的名称,而不是“完成”,我希望拥有自己的处理程序。
子面板应该能够覆盖父面板“Next”处理程序代码。例如,当我在panel1上时,如果我点击“下一步”,我想做一些 验证,然后我想调用父面板的“下一步”处理函数。
答案 0 :(得分:0)
为什么不在initComponent
中创建特定于孩子的按钮,例如:
childPanel = Ext.extend(MyUi.ParentPanel, {
initComponent: function() {
var items = [panel1, panel2];
Ext.apply( this, {
items: items
});
this.buttons = [{
text: "Next",
id: "card-next",
handler: function(){
//your new handler here
}
},{
text: "Previous",
id: "card-prev",
handler: function(){
Ext.getCmp('card-id').navigationHandler(-1);
},
disabled: true
},{
text: "Complete",
id: "finishButton",
}];
Cx.Ui.ProvisionRPoolWizardPanel.superclass.initComponent.apply(this);
});