PDA

View Full Version : How to open remote filtering combobox with value already saved



thcm
23 Jul 2015, 10:39 AM
Hello,

I'm new with extjs so excuse if its a trivial question.

I've added a combobox to my page with remote filtering. Its working as intended, but when I save the page and reopen it, the combo isn't loaded with the value previously saved.

Here is the code I used to create the combo:

var comboAutoPes= Ext.create('Ext.form.field.ComboBox', {
id: "cmbAutoPes",
minChars: 1,
hideTrigger: true,
displayField: "text",
valueField: "value",
typeAhead: true,
width: 242,
listConfig: {loadMask: true, width: 242, maxHeight: 172},
cls: "input_select",
triggerAction: "query",
renderTo: "divAutoPes",
store: {
fields: ["text", "value"],
proxy: {
type: "ajax",
url: "AjaxResponse?op=FilterCombo&domcod=25682796"
}
}

After saving and reopening the page, I have the value previously saved when I'm creating the combo's code, but I dont know where to set it in the code, since the store is still empty because no filtering has been done.

Could anyone please help me?

Thanks in advance!

joel.watson
23 Jul 2015, 2:20 PM
Hi--

You should be able to set the value on the combobox (value: 'yourvalue'), and it should resolve the correct selection once the store loads.

Thanks!
Joel

thcm
24 Jul 2015, 10:57 AM
I've tried to set the value, but it still doesnt work.


I've made some changes to the combo box, here's how it looks like when I reopen the page


var comboAutoPes = Ext.create('Ext.form.field.ComboBox', {
id: "cmbAutoPes",
minChars: 1,
hideTrigger: true,
displayField: "text",
valueField: "value",
typeAhead: true,
forceSelection: true,
width: 242,
listConfig: {loadMask: true, width: 242, maxHeight: 172},
cls: "input_select",
mode: "remote",
value: 25589529,
triggerAction: "all",
renderTo: "divAutoPes",
store: {
autoLoad: true,
fields: ["value", "text"],
proxy: {
type: "ajax",
url: "AjaxResponse?op=FilterCombo&domcod=25682796"
}
}
});

With these changes, as soon as the combo is rendered, it calls an Ajax and I get this response


[
{"value":25589529, "text":"Jhonny"}
,{"value":25038292, "text":"Paul"}
,{"value":26063411, "text":"Mary"}
,{"value":26062742, "text":"Peter"}
]


I want the combo to show "Jhonny" selected as it has the value set on the combo, but it remains empty.

Is there anything else I can do?

Thanks for helping!

joel.watson
25 Jul 2015, 8:33 AM
Hmm, this may be a bug in the version you're using. When I use this against the latest nightly build of Ext JS 4, and current version of Ext JS 5, it behaves as expected. Are you able to upgrade?

Thanks!
Joel

f.baron
26 Jul 2015, 11:17 PM
Probably the store loads after component initialization, try to set value on store's load.

thcm
27 Jul 2015, 5:38 AM
Unfortunately I can't upgrade my Ext version, but I figured out another way to do this.

I just added "data" to my store with the value that I want to load when the combo initialize.


var comboAutoPes= Ext.create('Ext.form.field.ComboBox', {
id: "cmbAutoPes",
minChars: 1,
hideTrigger: true,
displayField: "text",
valueField: "value",
typeAhead: true,
forceSelection: true,
width: 242,
listConfig: {loadMask: true, width: 242, maxHeight: 172},
cls: "input_select",
mode: "remote",
value: 25589529,
triggerAction: "all",
renderTo: "divAutoPes",
store: {
fields: ["value", "text"],
data: [{"value":25589529, "text":"Jhonny"}],
proxy: {
type: "ajax",
url: "AjaxResponse?op=FilterCombo&domcod=25682796"
}
}
});