touch - 如何从 Sencha Touch 2 中的字段集中获取数据？

Question

我在 Sencha Touch 2 中有一个字段集，如下所示：

{
                    id:'contactForm',
                    xtype: 'fieldset',
                    title: 'Information',
                    items: [
                        {
                            xtype: 'textfield',
                            label: 'First Name',
                            placeHolder: 'Your First Name',
                            name:'firstName',
                            id:'firstName',
                        },
                        {
                            xtype: 'textfield',
                            label: 'Last Name',
                            placeHolder: 'Your Last Name',
                            name:'lastName'
                        },
                        {
                            xtype: 'emailfield',
                            label: 'Email',
                            placeHolder: 'email@example.com'
                        },
                        {
                            xtype: 'button',
                            height: 37,
                            style: 'margin-left:35%',
                            width: 100,
                            iconAlign: 'center',
                            text: 'Submit',
                            action:'ContactSubmit'                        
                        },
                        {
                            xtype: 'hiddenfield',
                            id: 'HNumberOfBedRoom',
                            value:'2'
                        },
                        {
                            xtype: 'hiddenfield',
                            id: 'HPetFriendlyId',
                            value:'2'
                        }                
                ]
}

在我的控制器中，我有以下内容：

refs: { contactForm: '#contactForm' }

我可以通过使用检索值

var frmItems=this.getContactForm().getItems();
console.log(frmItems.items[1]._value);

这工作正常，但我想检索类似的值

frm.get('name/id of component')

有没有办法做到这一点？

Answer 1

使用 Ext.form.Panel 作为您的主要容器。

示例片段

Ext.define('App.view.ContactForm',
{
  extend : 'Ext.form.Panel',
  xtype : 'contactform',
  id : 'contactForm',
  config : {
    items : [
      { 
        xtype : 'fieldset',
        items : [
           {
             {
                xtype: 'textfield',
                label: 'First Name',
                placeHolder: 'Your First Name',
                name:'firstName',
             },
         ]
       }
});

在你的控制器中

参考：{contactForm：'#contactForm'}

然后在你的函数中你可以做

this.getContactForm().getValues().firstName

（使用字段的名称值）

或者

var vals = this.getContactForm().getValues();
vals.firstName;

如果您绝对可以提供帮助，请避免在顶层使用 Ext.getCmp() 或平面 Ext.get()。如果您正在构建自定义控件，则可能必须使用这些控件，否则您将自己弄得太难了。

Answer 2

您应该能够为id您的字段分配一个，然后Ext.getCmp('-yourId-');或Ext.get('-yourId-');

（http://docs.sencha.com/touch/2-0/#!/api/Ext.Component-cfg-id）

Answer 3

不要太挣扎

首先将 id 分配给该字段并使用 id 获取值就是这样..

     {
          xtype: 'textfield',
          id: 'username',      // id
          name: 'username',
          placeHolder: '------UserName------',                 
        },


         Ext.getCmp('username').getValue();     // now get value using that id..

Answer 4

refs:[
        {
            ref:'contentForm',
            // selector:'#contentForm'
            contentForm:'#contentForm'
        }
    ],

-

var form = Ext.getCmp('contentForm');

console.log(form.getValues());

Answer 5

分配itemId: firstName给textfield

在 中Controller，您想要获取值的地方，使用这个：

Ext.ComponentQuery.query('textfield[itemId=firstName]')[0].getData();