View Full Version : ComboBox forceSelection with remote store

7 Apr 2014, 6:45 AM
I have a ComboBox that loads its data from a remote store. This ComboBox may have a pre-selected value when it gets created. I want to enforce that the user only selects values that are inside the ComboBox, so I use forceSelection: true.

Unfortunately, the pre-selected value is not selected, and it doesn't even show up in the ComboBox. When I take forceSelection out, the value is there, and it is selected after the store loads.


Ext.onReady(function() {
var genres = Ext.create('Ext.data.Store', {
fields: ['genre'],
proxy: {
type: 'ajax',
url: 'data1.json',
reader: {
type: 'json',
root: 'data'
autoLoad: true

Ext.create('Ext.form.ComboBox', {
fieldLabel: 'Choose Genre',
store: genres,
value: 'number4',
forceSelection: true,
displayField: 'genre',
valueField: 'genre',
typeAhead: true,
renderTo: Ext.getBody()


"success": true,
"totalCount": 8,
"data": [
{genre: "number1"},
{genre: "number2"},
{genre: "number3"},
{genre: "number4"},
{genre: "number5"},
{genre: "number6"},
{genre: "number7"},
{genre: "number8"}

Fiddle (https://fiddle.sencha.com/#fiddle/4ro). The documentation doesn't state that forceSelection (http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.form.field.ComboBox-cfg-forceSelection) can't be used with an Ajax store, so I'm wondering if it's a bug, or if I'm just using something improperly.

7 Apr 2014, 8:51 AM
Just an update, I found this code in the setValue function (line 140667 of ext-all-dev for 4.2.1), and I'm not sure why it exists:

if (!me.forceSelection) {
dataObj = {};
dataObj[me.displayField] = value[i];
// TODO: Add config to create new records on selection of a value that has no match in the Store
// Else, if valueNotFoundText is defined, display it, otherwise display nothing for this value
else if (Ext.isDefined(valueNotFoundText)) {

So apparently if forceSelection is set to false, your value gets set... otherwise, display the valueNotFoundText. Why does forceSelection matter in order to set the initial value? Is it to safeguard that the initial value could be an invalid selection?

9 Apr 2014, 8:54 AM
Actually it is set to account for a possible race condition, where the store is not loaded yet. In you fiddle, if you explicitly load the store (genres.load();) the value is set as you expect it to, otherwise, the store is autoloaded until required. Check it here: https://fiddle.sencha.com/#fiddle/4uc

9 Apr 2014, 10:58 AM
Thanks for the reply, but unfortunately, I don't want to autoLoad it... I have several combo boxes in a window that gets opened, and I don't want to bog down the app by loading all of the stores when the window opens... only want them to load when they're triggered. I realize I can make a buffered store, but I don't want to.

I'm just confused why the combo box just can't have the value set... if I'm setting an explicit value, there should be no race condition, but then again, y'all are compensating for use cases I am not.