PDA

View Full Version : Comboboxes 4.0.2 vs 4.0.7-gpl



gnube
3 Dec 2011, 5:50 AM
I have noticed that my comboboxed behave differently with 4.0.7-gpl than they did on 4.0.2a

On 4.0.2a the list was able to be displayed when a valid item was selected. Just click on the dropdown button and you see the list.

On 4.0.7-gpl the list is hidden when an valid item is selected. Click on the dropdown and you just see the selected item. Delete a character from the edit box and the list appears.

I want the 4.0.2a behavior, I have tried altering config items (forceSelection, typeAhead, selectsOnTab, and triggerAction - maybe more). I have not hit upon a config which will show me the list when a valid item is selected.

Deleting a character is not intuitive and thus not an acceptable workaround for me.

If someone can supply me a config which will make the combo show me the options again that would be great!

skirtle
3 Dec 2011, 11:43 AM
It should just be triggerAction: 'all', which is the default. Could you post your config?

gnube
6 Dec 2011, 6:55 PM
Thanks for the reply skittle, I've been unable to get back to this until now.

I have jiggling the config hence the commented guff - no luck. Here is what I have on the combo box form field at the moment,


{
xtype: 'combobox',
allowBlank: false,
// forceSelection: true,
typeAhead: false,
triggerAction: 'all',
disableKeyFilter:'true',
// selectsOnTab: true,
store: Ext.data.StoreManager.lookup('control_groupcombobox'),
listeners: {
beforequery: function(qe){ // reload the store the next time it expands
delete qe.combo.lastQuery;
}
},
valueField: 'id',
displayField: 'name'
},
renderer: function(id){
var rtn = '- none selected -';
var rendererStore = Ext.data.StoreManager.lookup('control_groupcombobox');
var model = rendererStore.getById(id);
if (model){
rtn = model.get('name');
}
return rtn;
}

}

gnube
6 Dec 2011, 7:39 PM
Ah - removing that listener seems to have done the trick. I don't recall where I found instruction for adding that - I would like to reload the store upon triggering a list display in order to refresh the combo box display with changes made since it was last loaded. Will just having "triggerAction: all" achieve this I wonder?

skirtle
6 Dec 2011, 10:36 PM
That advice comes from here:

http://docs.sencha.com/ext-js/4-0/#!/api/Ext.form.field.ComboBox-property-lastQuery

lastQuery is used internally to remember the most recent query sent to the server. If the next query is the same it won't bother sending the request. Deleting lastQuery should just ensure that it doesn't match the next query, forcing the request to be sent.

I've just taken a look at the 4.0.7 source and I don't see any reason why that listener would cause the problem you've described. Can you inspect the requests being sent to the server in both cases (using Firebug or similar) and try to explain the difference that way?

triggerAction: 'all' will just cause the trigger to activate the 'all query'. By default this sends an empty string to the server, though it it configurable. It has to pass the lastQuery test just the same as any other query, it won't force the request through.

gnube
8 Dec 2011, 5:33 PM
The best guess I can make based on my observations of the firebug 'net' trail:

a)is that there might be a sync issue going on between the listener clearing out the query and the control drawing its list.
b) the combo control aborts the creation of the selection list when it identifies that a valid selection has already been made.

On 4.0.2a I see that if a combo item is already selected from the list, the next click on the 'expand' button cause the list to flash on screen then disappear. The second click on the button caused the list to appear and stay onscreen for selection. This makes it look like a double click is required on the drop down button to access the list.

On 4.0.7 it looks as though clicking on the drop down button works the same every time - that is the list is drawn then removed. If I delete a character from the combo's selection then the list will draw.

Could it be that the intention is not to draw the list if the current selection is valid and that 4.0.7 has 'fixed' the combo be preventing the second click from drawing the list?

skirtle
8 Dec 2011, 11:30 PM
This is all very strange. Do you have any overrides applied to the combobox to fix bugs? If you do, try removing them. At the moment that's the only consistent theory I have for what you're seeing.


The best guess I can make based on my observations of the firebug 'net' trail:

a)is that there might be a sync issue going on between the listener clearing out the query and the control drawing its list.
b) the combo control aborts the creation of the selection list when it identifies that a valid selection has already been made.

Could you tell us exactly what you see? What requests are sent, what response do you get, what do you see in the drop-down?


On 4.0.2a I see that if a combo item is already selected from the list, the next click on the 'expand' button cause the list to flash on screen then disappear. The second click on the button caused the list to appear and stay onscreen for selection. This makes it look like a double click is required on the drop down button to access the list.

I'm familiar with this behaviour, I believe it's a bug present in both 4.0.2 and 4.0.7. However, I've only seen it when using queryMode: 'remote' and triggerAction: 'query', the second of which you aren't using.


On 4.0.7 it looks as though clicking on the drop down button works the same every time - that is the list is drawn then removed. If I delete a character from the combo's selection then the list will draw.

Could it be that the intention is not to draw the list if the current selection is valid and that 4.0.7 has 'fixed' the combo be preventing the second click from drawing the list?

No, I don't think so.

gnube
1 Jan 2012, 3:52 PM
I came back to look at this again today - I notice that my original description is for a 'editor column' so I made a mock up of a simple 'Ext.form.field.ComboBox'

The result was better but still not quite right in my book. The Ext.form.field.ComboBox requires me to click the dropdown arrow twice - the first time seems not to do anything - the second time the list displays. When I remove the listener then the store contents render on the first use of the arrow.

I am going to have to choose the best of two bad outcomes it seems - I really don't like that the combo might be presenting an incomplete list of options should the remote store have been updated but that is better than a confusing UI.


// Simple ComboBox using the data store
var simpleAddessTypeCombo = Ext.create('Ext.form.field.ComboBox', {
fieldLabel: 'Select a single type',
renderTo: 'simpleAddressTypeCombo',
// displayField: 'name',
width: 320,
labelWidth: 130,
store: addressTypesStore,
queryMode: 'local',
typeAhead: true,

valueField: 'id',
displayField: 'name',
allowBlank: false,
sortable: true,
typeahead: true,
triggerAction: 'all',
selectOnTab: true,
listeners: {
beforequery: function(qe){ // reload the store the next time it expands
delete qe.combo.lastQuery;
return true;
}
},
queryMode: 'remote'

});