【问题标题】:Extjs5 : ComboBox not showing the selected valueExtjs5:组合框不显示所选值
【发布时间】:2015-03-13 10:04:49
【问题描述】:

我创建了一个comboBox,当我选择一个值时,不会显示任何值。

 Ext.create("Ext.form.field.ComboBox", {
        name: el.name,
        fieldLabel: el.labelId,
        hidden: !(el.visible),
        displayField:"value",
        valueField:"value",
        flex: 1,
        store:Ext.create("Ext.data.Store",{
               fields: ['key', 'value'],
               data: [
                        { key: "10",value: "etap 0"},
                        { key: "200",value: "etape 1"},
                        { key: "300", value: "etape 3"}
               ]
        }),
        regex: el.parameterType.regex,
        regexText: el.regExErrMsg,
        allowBlank: !el.mandatory,
        blankText: el.requiredErrMsg
    })

编辑

这正是返回组合的方法:

 drawField: function (el) {
    var me = this;
    var uiField = Ext.create(me.componentType, {
        name: el.name,
        fieldLabel: el.labelId,
        hidden: !(el.visible),
        flex: 1,
        regex: el.parameterType.regex,
        regexText: el.regExErrMsg,
        allowBlank: !el.mandatory,
        blankText: el.requiredErrMsg
    });
    if (el.parameterType.isCombo) {
        uiField.displayField = 'value';
        uiField.valueField = 'key';
        uiField.editable = false;
        uiField.store = Ext.create('Ext.data.Store', {
            fields: ['key', 'value'],
            data: el.parameterType.values
        });
    }
    return uiField;
}

el 参数是这样的JavaScript 对象:

{
    name: "",
    labelId: "Champ :",
    parameterType: {
        regEx: "^.*$",
        errID: "115",
        isCombo: true,
        values:[
            {key: "10", value: "etap 0"},
            {key: "200",value: "etape 1"},
            {key: "300",value: "etape 3"},
        ],
        selectedValue: "etap 0"
    },
    mandatory: false,
    visible: true,
    defaultValue: "",
    elementType: "LIST_BOX",
    regExErrMsg: "Valeur invalide.",
    requiredErrMsg: ""
}

me.componentType 在运行时是Ext.form.field.ComboBox

【问题讨论】:

  • 你是如何选择值的?
  • 我手动选择了值
  • 你是如何手动选择值的?
  • 网页控制台有错误吗?顺便说一句,store: 定义后缺少逗号
  • 组合在导航器中显示,我从显示的列表中选择一个值。选择后,该值不显示在组合中javascript控制台中没有错误

标签: javascript extjs combobox


【解决方案1】:

这个小提琴对我来说很好用,我删除了对 el 的引用,因为它对我来说是未定义的,并且还将 Ext.data.store 更改为 Ext.data.Store

https://fiddle.sencha.com/#fiddle/jj6

Ext.application({
    name: 'Fiddle',

    launch: function() {
        Ext.create("Ext.form.field.ComboBox", {
            renderTo: Ext.getBody(),
            displayField: "value",
            valueField: "value",
            flex: 1,
            store: Ext.create("Ext.data.Store", {
                fields: ['key', 'value'],
                data: [{
                    key: "10",
                    value: "etap 0"
                }, {
                    key: "200",
                    value: "etape 1"
                }, {
                    key: "300",
                    value: "etape 3"
                }]
            })
        });
    }
});

【讨论】:

  • 对我来说情况不一样 :(
  • 您能否用您的代码创建一个 fiddle 以便我们对其进行调试,您是否遇到控制台错误?
【解决方案2】:

valueField:"value" 错误,您应该指定 valueField:"key" 以使 ComboBox 正常工作

【讨论】:

  • 感谢您的回复,但我认为这不是问题的原因。我尝试了,但问题仍然存在
  • docs-origin.sencha.com/extjs/5.0.1/#!/api/… 处检查几乎与您的代码相同的一段代码。 ComboBox 应该使用数据存储中的 ID 存储值,而不是项目的标题
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2011-06-26
  • 1970-01-01
  • 2013-12-08
  • 1970-01-01
  • 1970-01-01
  • 2013-02-03
相关资源
最近更新 更多