PDA

View Full Version : extjs Form with a combobox



pravallika.esarla
18 Apr 2013, 3:45 AM
Hiii
Im new to extjs .....i created a combobox which retrieves data from database but now i want to include it in a form with a button .. but totally confused with merging :-/ a form and a combobox
this is my combobox code

app.js

Ext.Loader.setConfig({
enabled: true
});

Ext.application({
name: 'COMBO',
appFolder: 'app',
autoCreateViewport: false,

controllers: [
'Channels'
],
launch: function() {



Ext.create('Ext.container.Viewport', {
standardSubmit: true,
frame: true,
items: [
{
xtype: 'label',
text: ' '
},
{
xtype: 'label',
html: '<b>ExtJs ComboBox with LOCAL query</b>'
},

{
xtype: 'localChannelSearch',
flex: 1
},

});
}
});



LocalChannelSearch.js

Ext.define('COMBO.view.LocalChannelSearch', {
extend: 'Ext.form.ComboBox',
alias: 'widget.localChannelSearch',
queryMode: 'local',
displayField: 'name',
valueField: 'code',
forceSelection: true,
id: 'channelSearchBox',
labelWidth: 150,
fieldLabel: 'Please select a channel',
size: 50,
maxLength: 50,
allowBlank : false,
name: 'localChannel',
store: 'LocalChannels'

});

ChronoT52
18 Apr 2013, 4:51 AM
Instead of using the viewport to manage your form components, nest them in an Ext.form.Panel.



Ext.create('Ext.container.Viewport', {
items: [{
xtype: 'form',
frame: true,
items: [
{
xtype: 'label',
text: ' '
},
{
xtype: 'label',
html: '<b>ExtJs ComboBox with LOCAL query</b>'
},
{
xtype: 'localChannelSearch',
flex: 1
}
]
}]
});