ExtJs 组合框：加载后不填充自定义值（forceSelection 为 false）

Question

在 ExtJs4 中，我有一个带有组合框的表单，其中数据以 json 格式从数据库加载，

this.getForm().load({url: '/ext/get-patient', ...

用户可以输入除预定义值之外的自定义值，通过 forceSelection 属性进行配置设置为假。

我遇到的问题是：

当用户从组合框中的存储中选择任何预定义值、保存并再次重新加载条目时，一切正常。 但是当用户在组合框字段中输入自定义值（即“abcde”）时，保存（并且我可以看到输入的自定义值已正确存储在数据库中），然后再次加载表单数据（正确的自定义值位于 json 响应中），则在加载过程后组合框将不会填充此自定义值。

为什么 - 或者如何解决？

这是组合框使用的存储定义：

// The data store for the diagnoses combobox
var diagnosisStore = Ext.create('Ext.data.Store', {
    fields: ['label', 'value'],
    data: (function() {
        var data = [
            {label: '结膜炎', value: '结膜炎'},
            {label: '角膜炎', value: '角膜炎'},
            {label: '青光眼', value: '青光眼'},
            {label: '白内障', value: '白内障'},
            {label: '葡萄膜炎', value: '葡萄膜炎'},
            {label: '屈光不正', value: '屈光不正'},
            {label: '眼部异物', value: '眼部异物'},
            {label: '翼状胬肉', value: '翼状胬肉'},
            {label: '泪囊炎', value: '泪囊炎'},
            {label: '倒睫', value: '倒睫'},
            {label: '角膜溃疡', value: '角膜溃疡'},
            {label: '角膜白斑', value: '角膜白斑'},
            {label: '眼内炎', value: '眼内炎'}
            ];
        return data;
    })()
});

... 和组合框，请注意 forceSelection 设置为 false。

{
    xtype: 'combobox',
    name: 'diagnosis',
    fieldLabel: lang["patient.diagnosis"],
    labelWidth: 60,
    flex:1,
    store: diagnosisStore,
    valueField: 'value',
    displayField: 'label',
    typeAhead: true,
    queryMode: 'local',
    forceSelection: false
}

我还尝试在成功检索 json 响应后在侦听器中运行这行代码：

formPanel.getForm().findField('diagnosis').setValue(rec.data.diagnosis);

但除非我设置的值是商店的一部分，否则它不会填充。那么，为什么用户可以在组合框中输入任何内容，但我不能在代码中使用 setValue 执行相同的操作？对我来说没有意义。

编辑/更新：

有趣的是：即使自定义值未填充/未向用户显示，组合框似乎仍保留自定义值。因为当我调用这一行时：

alert( formPanel.getForm().findField('diagnosis').getValue() );

它实际上会在警报对话框中显示我刚刚尝试通过 setValue() 设置的值。 看来这个组合框组件有点问题。

我刚刚在 ExtJs 中发现这个组合框的另一个问题：还注意到，只有当我输入一个空格（“”）时，组合框中的空白值才会以表单（请求中的 json 参数）的形式提交，然后该字段实际上包含在提交的json参数中。

Answer 1

我找到了一个解决方法，尽管我仍然不明白为什么这是必要的：

在成功侦听器中，加载 json 响应后，我将自定义值添加到存储中，然后将组合框设置为这个新添加的值：

success: function() {
    diagnosisStore.add({label: rec.data.diagnosis, value: rec.data.diagnosis});
    formPanel.getForm().findField('diagnosis').setValue(rec.data.diagnosis);
},

不知道为什么在这种情况下当我想使用 setValue 时我需要将自定义值添加到商店，而用户可以通过键盘手动输入任何内容。