PDA

View Full Version : Problem with ComboBox and



zagreberlin
19 Aug 2011, 3:07 PM
Hi people,

why the following dont work with combobox?
If i put only the combox to the formPanel it works but when i put it to the fpItems variable it dont works.
I dont understand why.




/* on this way it doesnt work. it doesnt work only if the comboBox is in.
If the combobox is not in it works */

var fpItems =[
{
fieldLabel : 'Password',
id : 'fieldLabel1',
allowBlank : false,
inputType : 'password' // Attribut auf passwort setzen
},
{
fieldLabel : 'File',
allowBlank : false,
inputType : 'file'
},
{
xtype : 'textarea',
fieldLabel : 'My TextArea',
id : 'fieldLabel MyTextArea',
name : 'myTextArea',
anchor : '100%',
height : 100
},
{
xtype : 'numberfield',
fieldLabel : 'Numbers only',
allowBlank : false,
emptyText : 'This field is empty!',
decimalPrecision : 3,
minValue : 0.001,
maxValue : 2
},
{
xtype : 'combobox',
fieldLabel : 'Choose State',
store : states,
queryMode : 'local',
displayField : 'name',
valueField : 'abbr'
}
];

var fp = new Ext.form.FormPanel({ renderTo : Ext.getBody(),
id : 'MyFormPanel',
fileUpload : true,
width : 400,
height : 460,
title : 'Exercising textfields',
frame : true,
bodyStyle : 'padding: 6px',
labelWidth : 126,
defaultType : 'textfield',
defaults : {
msgTarget : 'side',
qtip : 'Min 3 or Max 7 chars',
anchor : '-20'
},
items : fpItems
});




why it works on this way?




var comboBox = {
xtype : 'combobox',
fieldLabel : 'Choose State',
store : states,
queryMode : 'local',
displayField : 'name',
valueField : 'abbr'
}

var fp = new Ext.form.FormPanel({
renderTo : Ext.getBody(),
id : 'MyFormPanel',
fileUpload : true,
width : 400,
height : 460,
title : 'Exercising textfields',
frame : true,
bodyStyle : 'padding: 6px',
labelWidth : 126,
defaultType : 'textfield',
defaults : {
msgTarget : 'side',
qtip : 'Min 3 or Max 7 chars',
anchor : '-20'
},
items : combobox
});


Please help!

zagreberlin
20 Aug 2011, 2:40 AM
nobody knows?

aacoro
21 Aug 2011, 8:03 AM
instead of
store : states,

please post sample data so the it is faster reproducable...
I do not see any weird things...

christocracy
22 Aug 2011, 4:50 AM
When you say "doesn't work", what exactly do you mean.

It's unclear if you mean "the combo doesn't render on-screen" or "when I click the combo, the list contains no items".

Perhaps a screenshot?

aacoro
22 Aug 2011, 12:13 PM
Step 1:

create a HTML page:


<html>
<head>
<title>Tespage</title>
<link href="http://docs.sencha.com/ext-js/4-0/extjs/resources/css/ext-all.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://docs.sencha.com/ext-js/4-0/extjs/bootstrap.js"></script>
<script type="text/javascript" src="test.js"></script>
</head>
<body>
</body>
</html>


Step 2:

create the test.js in the same folder and copy paste this inside test.js:


Ext.onReady(function () {
console.log('Ext Js started succesfully.');


var states = Ext.create('Ext.data.Store', {
fields: ['abbr', 'name'],
data: [{
"abbr": "AL",
"name": "Alabama"
}, {
"abbr": "AK",
"name": "Alaska"
}, {
"abbr": "AZ",
"name": "Arizona"
}]
});


var fpItems = [{
fieldLabel: 'Password',
id: 'fieldLabel1',
allowBlank: false,
inputType: 'password'
}, {
fieldLabel: 'File',
allowBlank: false,
inputType: 'file'
}, {
xtype: 'textarea',
fieldLabel: 'My TextArea',
id: 'fieldLabel MyTextArea',
name: 'myTextArea',
anchor: '100%',
height: 100
}, {
xtype: 'numberfield',
fieldLabel: 'Numbers only',
allowBlank: false,
emptyText: 'This field is empty!',
decimalPrecision: 3,
minValue: 0.001,
maxValue: 2
}, {
xtype: 'combobox',
fieldLabel: 'Choose State',
store: states,
queryMode: 'local',
displayField: 'name',
valueField: 'abbr'
}];


var fp = new Ext.form.FormPanel({
renderTo: Ext.getBody(),
id: 'MyFormPanel',
fileUpload: true,
width: 400,
height: 460,
title: 'Exercising textfields',
frame: true,
bodyStyle: 'padding: 6px',
labelWidth: 126,
defaultType: 'textfield',
defaults: {
msgTarget: 'side',
qtip: 'Min 3 or Max 7 chars',
anchor: '-20'
},
items: fpItems
});




});




this works!

Pozdrav!

This my result:

27619

zagreberlin
1 Sep 2011, 4:00 PM
thx aacoro!
the problem was that the states were under the combobox.