ExtJs ComboBox 刷新选定（原始）值

Question

I have a combobox with store items ({ value, text}), and sometimes I need to update the texts. When I do that the selected value (text) is not updated.

Here is the fiddle to illustrate and the code looks like below. We pick an item in the drop down then we click on update text. This will update the text in the drop down but not the combobox raw value.

[Update]: replaced model.set() with 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); } } ] }); } });

Answer 1

You have to use

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

to change the value in each record. Your button code has to be:

 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"); 
                });
            }
          }]

Update

You can solve it with that code:

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

I have written a Sencha fiddle for you showing the solution: https://fiddle.sencha.com/#view/editor&fiddle/3cf6

I glad if it helped. Please consider accepting the best answer.

Answer 2

You have forgotten to set the valueField and displayField Property for the combobox The combobox attributes should be like this

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

Now the rawValue can be fetched from the combobox