Javascript Extjs:如何获取表单的值
我是Extjs新手,我试图创建一个只包含一个字段的简单登录表单,但我无法获得该字段的值 具体来说,我从Main.js调用我的登录面板:Javascript Extjs:如何获取表单的值,javascript,extjs,sencha-touch-2,Javascript,Extjs,Sencha Touch 2,我是Extjs新手,我试图创建一个只包含一个字段的简单登录表单,但我无法获得该字段的值 具体来说,我从Main.js调用我的登录面板: Ext.define('appTrial.view.Main', { extend: 'Ext.tab.Panel', xtype: 'main', requires: [ 'Ext.TitleBar', 'Ext.Video', 'appTrial.view.Login', ], controllers: [
Ext.define('appTrial.view.Main', {
extend: 'Ext.tab.Panel',
xtype: 'main',
requires: [
'Ext.TitleBar',
'Ext.Video',
'appTrial.view.Login',
],
controllers: [
'AssociaAttivitaController'
],
config: {
tabBarPosition: 'bottom',
items: [
{
title: 'Welcome',
iconCls: 'home',
styleHtmlContent: true,
scrollable: true,
items: [{
docked: 'top',
xtype: 'titlebar',
title: 'Welcome to My New App!!!',
},{
xtype: 'container',
name: 'mainContainer',
layout: {
type: 'hbox',
align: 'center',
pack: 'center'
},
items: [{
xtype: 'Login',
title:'Login', //call Login here
margin: '80 0 0 0'
},
]
}
]
},
{
title: 'Get Started',
iconCls: 'action',
items: [
{
docked: 'top',
xtype: 'titlebar',
title: 'Getting Started'
},
/*{
xtype: 'video',
url: 'xxx'
}*/
]
}]
}
});
当我像这样创建Login.js时,我可以看到面板,但它没有得到值:
Ext.define('appTrial.view.Login', {
extend: 'Ext.form.FormPanel',
xtype: 'login',
alias: 'widget.Login',
config: {
title: 'Login',
width: 200,
height: 200,
items: [{
xtype: 'container',
name: 'loginContainer',
layout: {
type: 'vbox',
align: 'center',
pack: 'center',
},
items: [{
layout: {
pack: 'center'
},
html :'Associa attivita'
},
{
xtype: 'fieldset',
items: [{
xtype: 'textfield',
name: 'codAttivita',
}]
},
{
xtype: 'toolbar',
layout: {
pack: 'center'
}, // layout
ui: 'plain',
items:[{
xtype: 'button',
text: 'Associa',
ui: 'confirm',
action: 'login',
},{
xtype: 'button',
text: 'Reset',
ui: 'decline',
handler: function (btn, evt) {
var cod = codAttivita.getValue(); //here, the cod is null
Ext.Msg.confirm('', 'Are you sure you want to reset this form?', function (btn) {
if (btn === 'yes') {
form.setValues({
codAttivita: ''
});
}
});
}
}]
}],
}]
},
});
在阅读其他主题时,我了解到我必须将表单分配给一个变量;我做到了,但使用下面的Login.js,我根本看不到面板:
var formPanel = Ext.create('Ext.form.Panel', {
name: 'loginForm',
/* defaults:{
layout: 'form',
xtype: 'container',
//defaultType: 'textfield',
labelWidth: 150,
width: 300
},*/
items:[{
xtype: 'container',
name: 'loginContainer',
layout: {
type: 'vbox',
align: 'center',
pack: 'center',
},
items: [{
layout: {
pack: 'center'
},
html :'Associa attivita'
},
{
xtype: 'fieldset',
items: [{
xtype: 'textfield',
name: 'codAttivita',
id: 'codAttivita',
allowBlank: false
}]
}]
}]
});
Ext.define('appTrial.view.Login', {
extend: 'Ext.form.FormPanel',
xtype: 'login',
alias: 'widget.Login',
config: {
title: 'Login',
width: 200,
height: 200,
items: [{
xtype: 'container',
name: 'loginContainer',
layout: {
type: 'vbox',
align: 'center',
pack: 'center',
},
items: [
formPanel
],
buttons: [{
text:'Associa',
ui: 'confirm',
action: 'login',
},{
text: 'Reset',
ui: 'decline',
handler: function (btn, evt) {
var form = formPanel.getForm();
var cod = form.findField('codAttivita');
Ext.Msg.confirm('', 'Are you sure you want to reset this form?', function (btn) {
if (btn === 'yes') {
form.setValues({
codAttivita: ''
});
}
});
}
}]
}]
},
});
有人知道吗
提前感谢正如您所知,按照惯例,别名都是小写的(请参阅:,要点8) 您可以在配置中为登录表单分配一个id
{
xtype: 'login',
id: 'login-form',
title:'Login', //call Login here
margin: '80 0 0 0'
}
然后,您可以按id查询表单以获取值:
Ext.getCmp('login-form').getValues();
如果不为表单提供id,还可以通过xtype查询组件:
Ext.ComponentQuery.query('login')[0].getValues();