How do I get an extjs combo box to act like a normal, html select box?

You can get that behaviour just by disabling those features when you instanciate the Combo object.

You can get that behaviour just by disabling those features when you instanciate the Combo object: { xtype: 'combo', fieldLabel: 'My Dropdown', name: 'type', allowBlank: false, editable: false, triggerAction: 'all', typeAhead: false, mode: 'local', width:120, listWidth: 120, hiddenName: 'my_dropdown', store: 'val1', 'First Value', 'val2', 'Second Value', readOnly: true } Replace the mode: 'local' and store argument in your case if you'd like it to be bound to a Ext.data. JsonStore for example.

1 Thanks - I'd found some of those, but it was "triggerAction: 'all'" that was the important one I was missing. Without that, the drop down hides all the items other than the one that was selected. – Spike Williams Jan 20 '10 at 16:20.

The currently accepted solution works great, but if anyone wants a ComboBox that also handles keyboard input like a plain HTML select box (e.g. , each time you press "P" is selects the next item in the list beginning with "P"), the following might be helpful: { xtype: 'combo', fieldLabel: 'Price', name: 'price', hiddenName: 'my_dropdown', autoSelect: false, allowBlank: false, editable: false, triggerAction: 'all', typeAhead: true, width:120, listWidth: 120, enableKeyEvents: true, mode: 'local', store: 'val1', 'Appaloosa', 'val2', 'Arabian', 'val3', 'Clydesdale', 'val4', 'Paint', 'val5', 'Palamino', 'val6', 'Quarterhorse', , listeners: { keypress: function(comboBoxObj, keyEventObj) { // Ext. Store names anonymous fields (like in array above) "field1", "field2", etc.Var valueFieldName = "field1"; var displayFieldName = "field2"; // Which drop-down item is already selected (if any)? Var selectedIndices = this.view.

GetSelectedIndexes(); var currentSelectedIndex = (selectedIndices. Length > 0)? SelectedIndices0 : null; // Prepare the search criteria we'll use to query the data store var typedChar = String.

FromCharCode(keyEventObj.getCharCode()); var startIndex = (currentSelectedIndex == null)?0 : ++currentSelectedIndex; var matchIndex = this.store. Find(displayFieldName, typedChar, startIndex, false); if( matchIndex >= 0 ) { this. Select(matchIndex); } else if (matchIndex == -1 && startIndex > 0) { // If nothing matched but we didn't start the search at the beginning of the list // (because the user already had somethign selected), search again from beginning.

MatchIndex = this.store. Find(displayFieldName, typedChar, 0, false); if( matchIndex >= 0 ) { this. Select(matchIndex); } } if( matchIndex >= 0 ) { var record = this.store.

GetAt(matchIndex); this. SetValue(record. Get(valueFieldName)); } } } }.

Not too sure if this is close to what you want. Var combo = new Ext.form. ComboBox({ typeAhead: false, ... }).

Var buf = ; buf. Push('aA1'); buf. Push('aA2'); buf.

Push('bA3'); buf. Push('cA4'); var items = buf. Join(''); new Ext.

Component({ renderTo: Ext.getBody(), autoEl: { tag:'select', cls:'x-font-select', html: items } }).

I cant really gove you an answer,but what I can give you is a way to a solution, that is you have to find the anglde that you relate to or peaks your interest. A good paper is one that people get drawn into because it reaches them ln some way.As for me WW11 to me, I think of the holocaust and the effect it had on the survivors, their families and those who stood by and did nothing until it was too late.

Related Questions