Question

我注意到ST2和selectfield选择器存在问题。我正在桌面浏览器和平板电脑上进行测试，两者似乎都表现出同样的问题。

问题似乎源于表格数据为空或未初始化。我的例子是用户登录他们的帐户并需要设置他们的婚姻状况。因为在支持商店模型实际上对于他们的婚姻状况是“空”之前从未设置过。当他们点击选择器时，选择器由于某种原因自动选择清单中的第一个项目。通过项目右侧的复选标记可以看出这一点。第二个副作用是，如果您随后选择第一个项目，ST2不会将此视为项目更改，因此不会将选择更改传播回表单。

这是一个错误吗？我如何解决这个问题？

Ext.define('Gender', {
    extend: 'Ext.data.Model',
    config: {
        fields: [
            {name: 'Id', type: 'int'},
            {name: 'ItemName',  type: 'string'}           
        ]
    }
});

Ext.define('Details', {
    extend: 'Ext.data.Model',
    config: {
        fields: [       
            {name: 'Gender',  type: 'int'}           
        ]
    }
});

var myGenderStore = Ext.create('Ext.data.Store', {
    model: 'Gender',
    data : [
        {Id: 1, ItemName: 'Male'},
        {Id: 2, ItemName: 'Female'}
    ]   
});

var myDetailsStore = Ext.create('Ext.data.Store', {
    model: 'Details',
    data : [
        { Gender: null }        
    ]   
});

var p = Ext.create('Ext.form.Panel', {
    fullscreen: true,
    items: [
        {
            xtype: 'fieldset',
            title: 'Select',
            items: [
                {
                    xtype: 'selectfield',
                    label: 'Choose one',
                    displayField: 'ItemName',
                    valueField: 'Id',
                    store: myGenderStore,
                    name: 'Gender'
                }
            ]
        }
    ]
});

p.setRecord(myDetailsStore.getAt(0))
Ext.Viewport.setActiveItem(p);
// notice the picker has 'Male' selected even though the backing store for the Gender field is null
// also, we want to select Male from the list, but this isn't reflected on the form
// run below command in console window after selecting 'Male' even though it is selected and it shows null
// It only seems to like changes to the value as selecting female works. If then select Male from Female this also works.
p.getValues().Gender;

Answer 1

您可以为选择字段

设置值

 p.down('selectfield[name=Gender]').setValue(myGenderStore.getAt(0).get('Id'))

参见示例：http://www.senchafiddle.com/#OuCtQ#GQJ2C

感谢

Answer 2

只需将 autoSelect 配置属性设置为 false ，以防止默认选择如下：

 {
                    xtype: 'selectfield',
                    label: 'Choose one',
                    displayField: 'ItemName',
                    valueField: 'Id',
                    store: myGenderStore,
                    name: 'Gender',
                    autoSelect:false
                }

在sencha touch中的Selectfield不尊重空值

2 个答案: