ExtJs ComboBox 刷新选定的(原始)值

ExtJs ComboBox Refresh Selected (Raw) Value

我有一个包含商店项目 ({ value, text}) 的组合框,有时我需要更新文本。当我这样做时,所选值(文本)不会更新。

这里是 the fiddle to illustrate,代码如下所示。我们在下拉列表中选择一个项目,然后单击更新文本。这将更新下拉列表中的文本,但不会更新组合框的原始值。

[更新]:将 model.set() 替换为 store.loadData()

Ext.application({
    name : 'Fiddle',

    launch : function() {
        Ext.create("Ext.form.Panel", {
            renderTo: Ext.getBody(),
            width: 300,
            height: 200,
            bodyPadding: 20,
            layout: "form",

            items: [
                {
                    xtype: "combobox",
                    itemId: "pickmin",
                    fieldLabel: "Test",
                    queryMode: "local",
                    store: {
                        fields: ["value", "text"],
                        data: [
                            { value: 1, text: "Text 1" },
                            { value: 2, text: "Text 2" },
                            { value: 3, text: "Text 3" },
                            { value: 4, text: "Text 4" },
                        ]
                    }
                }
            ],

            buttons: [
                {
                    text: "Update Text",
                    handler: function (btn) {
                        const combo = btn.up("form").down("#pickmin");
                        const newData = []
                        combo.store.each(r => {
                            newData.push({
                                value: r.data.value,
                                text: r.data.text + "0"
                            });
                        });
                        combo.store.loadData(newData);
                    }
                }
            ]
        });
    }
});

你必须使用

 r.set("text", r.data.text + "0");

更改每条记录中的值。您的按钮代码必须是:

 buttons: [{
            text: "Update Text",
            handler: function (btn) {
                const combo = btn.up("form").down("#pickmin");
                combo.store.each(r => {
                    r.set("text", r.data.text + "0"); 
                });
            }
          }]

更新

你可以用那个代码解决它:

combo.getStore().on("load",
    function (store, records, successful, operation, eOpts) {
       combo.setValue(combo.getValue());
    },
    this
)

我写了一个 Sencha fiddle 给你展示解决方案:https://fiddle.sencha.com/#view/editor&fiddle/3cf6

如果有帮助我很高兴!请考虑采纳最佳答案。

您忘记为组合框设置 valueField 和 displayField 属性 组合框属性应该是这样的

 xtype: "combobox",
 itemId: "pickmin",
 valueField:"value",
 displayField :"text"

现在可以从组合框中获取原始值