我有一个示例登录表单。那里有一个控制器、视图和一个模型。我想验证表单。我的表单面板 ID 是“formPanelLogin”,并且必须更新控制器中的表单记录。但是这段代码“formPanelLogin.updateRecord(teamModel);” 无法工作并出现“updateRecord 未定义”之类的错误消息。请给我这个问题的答案。我的代码将遵循..
//Controller
Ext.define('MyApp.controller.mvcController', {
extend: 'Ext.app.Controller',
config: {
refs: {
BtnSubmit: "#btnSubmit",
BtnCancel:"#btnCancel",
BtnPromoHome:"#PromotionsBtnHome",
BtnThirdBack:"#thirdBtnBack",
BtnSecondBack:"#btnUnderHoodService",
},
control: {
BtnSubmit:
{
tap: "onBtnSubmitTap"
},
BtnCancel:
{
tap: "onBtnCancelTap"
},
BtnPromoHome:
{
tap: "onBtnPromoHomeTap"
},
BtnSecondBack:
{
tap: "onBtnSecondBackTap"
},
BtnThirdBack:
{
tap: "onBtnThirdBackTap"
}
}
},
onBtnCancelTap: function (options)
{
//formPanelLogin.reset();
var teamModel = Ext.create('MyApp.model.MyModel'),
errors, errorMessage = '';
formPanelLogin.updateRecord (teamModel);
errors = teamModel.validate();
if (!errors.isValid()) {
errors.each(function (err) {
errorMessage += err.getMessage() + '<br/>';
}); // each()
Ext.Msg.alert('Form is invalid!', errorMessage);
} else {
Ext.Msg.alert('Form is valid!', '');
} // if
console.log("Cancel");
},
});
//view
Ext.define('MyApp.view.MyContainer', {
extend: 'Ext.Container',
config: {
layout:
{
type: 'card'
},
items: [
{
xtype: 'panel',
id: 'panelOuter',
layout:
{
type: 'card',
animation:
{
type: 'slide'
}
},
items: [
{
xtype: 'panel',
items: [
{
xtype: 'toolbar',
docked: 'top',
title: 'MVC',
items: [
{
xtype: 'button',
docked: 'left',
id: 'btnBack'
},
{
xtype: 'button',
docked: 'right',
id: 'btnHome'
}
]
},
{
xtype: 'formpanel',
docked: 'top',
height: 117,
id: 'formPanelLogin',
scrollable: true,
items: [
{
xtype: 'fieldset',
id: 'loginform',
items: [
{
xtype: 'textfield',
label: 'UserName',
name: 'userName',
labelWidth: '40%',
name: 'usernameField',
placeHolder: '...... Type here .......',
required: true
},
{
xtype: 'passwordfield',
label: 'Password',
labelWidth: '40%',
required: true
}
]
}
]
},
{
xtype: 'panel',
height: 45,
id: 'btnPanel',
items: [
{
xtype: 'button',
docked: 'right',
id: 'btnSubmit',
ui: 'action-small',
width: 85,
text: 'Submit'
},
{
xtype: 'button',
docked: 'right',
id: 'btnCancel',
ui: 'decline-small',
width: 85,
text: 'Cancel'
}
]
}
]}
]
},
});
//model
Ext.define('MyApp.model.MyModel', {
extend: 'Ext.data.Model',
config: {
fields : [
{
name: 'userName',
type: 'string'
},
{
name: 'password',
type: 'string'
}
],
validations: [
{
field: 'userName',
type: 'presence',
message: 'User Name is required.'
}
]
}
});