加载后的ComboBox.setValue设置错误的值

时间:2016-02-02 14:03:02

标签: ajax extjs combobox onload setvalue

我有combobox,它代表从服务器端重新获取的登录类型。登录类型的翻译应该在客户端进行。

这是从服务器端返回的json示例:

[
  {"valueField":"activeDirectory"},
  {"valueField":"userpass"}
]

Combobox的定义如下:

Ext.create('Ext.form.ComboBox', {
    fieldLabel : window._i18n['login.login-panel.logintype'],
    itemId : 'logintype',
    store : loginTypesStore,
    name : 'loginType',
    hiddenName: 'hiddenName',
    displayField : 'localizedDisplayField',
    valueField : 'valueField',
    submitValue: true,
    forceSelection: true,
    editable : false,
    allowBlank : false,
    queryMode: 'remote'
})

和模型和商店定义为:

Ext.define('loginTypeModel', {
    extend: 'Ext.data.Model',
    fields: [
        {name: 'valueField' },
        {
            name: 'localizedDisplayField',
            convert: function(value, record) {
                return window._i18n['login.login-panel.logintypename.' + record.get('valueField')];
            }
        }
    ],
    proxy: {
        type: 'ajax',
        url: 'Admin/LoginTypes',
        reader: {
            type: 'json'
        }
    }
});

var loginTypesStore = Ext.create('Ext.data.Store', {
    autoLoad: false,
    type: 'json',
    model: 'loginTypeModel'
});

我为商店添加了加载侦听器,它应该将组合框值设置为收到的第一个项目:

loginTypesStore.on('load', function () {
    var combo = Ext.getCmp('login-panel').getComponent('logintype');
    console.log('combo.Value : [' + combo.getValue() + '] -> [' + loginTypesStore.data.first().data.valueField + ']');
    combo.setValue(loginTypesStore.data.first().data.valueField); //loginTypesStore.data.first().data.valueField);
    console.log('combo.Value = ' +  combo.getValue());    
});

但是,在控制台输出中,我可以看到:

combo.Value : [null] -> [activeDirectory]
combo.Value = Active Directory EN

"Active Directory EN""activeDirectory"密钥的英文翻译。

这怎么可能?

当我用这样的本地替换商店时:

var loginTypesStore = Ext.create('Ext.data.Store', {
    fields: ['valueField', 'localizedDisplayField'],
    data: [
        {"valueField": "userpass", "localizedDisplayField": "Localized userpass"},
        {"valueField": "activeDirectory", "localizedDisplayField": "Localized activeDirectory"}
    ]
});

一切正常,即在控制台我看到:

combo.Value : [null] -> [userpass]
combo.Value = userpass

1 个答案:

答案 0 :(得分:0)

问题在于阅读翻译文件。翻译Active directory EN实际上在结尾处确实有不可见的\r字符,问题在于函数getValue。从下面的图片中,您可以看到变量d等于Active Directory EN,但它已附加\r,而b.getDisplayValue()则没有(我已调试并且此值已从DOM因此可能会遗失\r

enter image description here