What does ExtJS ComboBox triggerAction: "all" really do?

Question

I tried to create a simple ComboBox:

var combo1 = new Ext.form.ComboBox({
  store: [1,2,3],
  renderTo: document.body
});

But written this way it acts strangely:

• When you first time pop open the dropdown, it offers three choices.
• You choose one.
• But when you after that try to change your selection, the dropdown only offers one choice - the one you previously selected.

I compared my code to the samples on Ext homepage and discovered that adding triggerAction: "all" solves my problem:

var combo2 = new Ext.form.ComboBox({
  triggerAction: "all",
  store: [1,2,3],
  renderTo: document.body
});

ExtJS documentation for triggerAction doesn't tell me a lot:

The action to execute when the trigger is clicked. Use 'all' to run the query specified by the allQuery config option (defaults to 'query')

I haven't specified the allQuery option. Actually, I don't want to perform a query to the server at all.

So what does this triggerAction really do?

And is setting it to "all" really what I should do when I just want a simple static combobox?

Solution

After choosing an item, the list is filtered to match the current text value. In your case, it's always exactly the chosen value, but is more obvious with multi-character values (see the state names example in Ext). If you delete the selected value, the dropdown will go back to having all values. triggerAction:'all' means do not filter, always show all values.

Comments

[duma]

This makes sense now, but this is a really poorly-named option!

[Brian Moeskau]

The reason for the name is that the config is inherited from TriggerField and so is used more generically outside of combos and does not even have to relate to filtering in other implementations. But yes, a combo-specific alias that is more descriptive might be nice.