combobox with drop list whose item height (for each item) is 3 pixels high!

[stratton]

I don't even see a property on the combobox control to set the height of the combobox items!

here's the offending combobox...

ExtJsComboBox4 = new Ext.form.ComboBox(
{
displayField:'stuff',
listWidth:0,
mode:'local',
store:[['mon'],['tue'],['wed']],
inlineStore:[
'mon',
'tue',
'wed'
],
valueField:'myid',
id:'ExtJsComboBox4',
applyTo:'ExtJsComboBox4',
width:130,
height:24
})

any ideas?
thanks!

[jay@moduscreate.com]

that's because the combo box list is powered by DataView!

try this example:

var names = [
    ['Jack Slocum'],
    ['Abe Elias'],
    ['Aaron Conran'],
    ['Evan Trimboli']
];

var mySimpleStore = new Ext.data.ArrayStore({
    data   : names,
    fields : ['name']
});

var combo = {
    xtype        : 'combo',
    fieldLabel   : 'Select a name',
    store        : mySimpleStore,
    displayField : 'name',
    typeAhead    : true,
    mode         : 'local'
}

new Ext.Window({
    title      : '',
    height     : 100,
    layout     : 'form',
    labelWidth : 80,
    bodyStyle  : 'padding: 5px',
    items      : combo
}).show()

[Condor]

Wow, there is a lot wrong here:

ExtJsComboBox4 = new Ext.form.ComboBox({
	//displayField:'stuff', <- don't use if specifying an array for store
	//listWidth:0, <- really?
	//mode:'local', <- not needed when specifying an array for store
	store:['mon','tue','wed'], // <- use 1-dimensional array
	//inlineStore: [...] <- what is this for?
	//valueField:'myid', <- don't use if specifying an array for store
	id:'ExtJsComboBox4',
	applyTo:'ExtJsComboBox4', // <- Is ExtJsComboBox4 really a <input type="text">?
	width:130//,
	//height:24 <- don't specify for combobox
});

[stratton]

Thanks so much for jumping in- this community is outstanding!

ok- i understand using the store: property of the combobox and binding to an actual store. (though i don't see ArrayStore in ExtJs).

What I'm try to do is something that is in the documentation indicating that you can provide an array 'directly' as the store property. So if you look at my combobox4, it bindings to the one dimension array- per the documentation. However, if you run the code- the droplist is only a few pixels high- while the combobox that binds to an actual store (in this case simplestore) renders 'correctly' with a legible drop-list item height.

Is there more i need to do to "stretch" the item height?

thanks!
-s


<input type="text" id="ExtJsComboBox4" />
<input type="text" id="ExtJsComboBox5" />

Ext.onReady(function() {

var ExtJsComboBox4 = new Ext.form.ComboBox(
{
mode: 'local',
store: [['mon'], ['tue'], ['wed']],
applyTo: 'ExtJsComboBox4',
labelWidth: 80,
height: 100
})

var names = [['bob'], ['ted'], ['joe']];
var simplestore = new Ext.data.SimpleStore({ data: names, fields:['name']});
var ExtJsComboBox5 = new Ext.form.ComboBox(
{
mode: 'local',
displayField: 'name',
store: simplestore,
applyTo: 'ExtJsComboBox5'
});

[stratton]

i don't know if you receive notification of my post- but i reworked the code per the comments in this thread and i'm still seeing strange ui behavior- if you see my post below.
(i'm sorry if you received notification on this thread already- i won't do this again, if you did.)
thanks.

[stratton]

For what it is worth... i defined the simply array in javascript incorrectly (store: [['mon'], ['tue'], ['wed']]).

It should be defined as shown below:

store: ['mon', 'tue', 'wed'],

If the array is incorrectly defined- the control is incorrectly rendered.