PDA

View Full Version : Combobox Selected value to load store



stoneboys
7 Mar 2012, 8:12 AM
hi i create combobox on extjs 4.0.7
My first code :
Not working, not result on console...just blank.


xtype: 'combobox',
id: 'zipcode',
name: 'ZipCode',
width: 300,
fieldLabel: 'Zip Code',
store: [[zip1, 'Name Zip 1'], [zip2, 'Name Zip 2'], [zip3, 'Name Zip 3']],
listeners: {
change: function(combo, value) { // I use change....
console.log(value);
MyStore.load({
params: {
id: value
}
});
}
}


Or My 2nd code :
Not working, not result on console...just blank too.


xtype: 'combobox',
id: 'zipcode',
name: 'ZipCode',
width: 300,
fieldLabel: 'Zip Code',
store: [[zip1, 'Name Zip 1'], [zip2, 'Name Zip 2'], [zip3, 'Name Zip 3']],
listeners: {
select: function(combo, value) { // I use select....
console.log(value);
MyStore.load({
params: {
id: value
}
});
}
}


what wrong from this code.
So how to create it working, i want if i select value on combobox , MyStore can loaded.. thanks

mitchellsimoens
7 Mar 2012, 10:59 AM
Are the events firing? There shouldn't be a reason if you select an item from the list that either event shouldn't fire.

chramer
7 Mar 2012, 11:20 AM
i really dont like your store, and also you dont have a 'displayField' and 'valueField'..
here is a sample of mine!


Ext.application({
name : 'test',
launch : function()
{
var anotherStore = Ext.create('Ext.data.Store', {
proxy : {
type : 'ajax',
url : 'someurl.php',
reader : {
type : 'json',
root : 'data'
}
}
});

var store = Ext.create('Ext.data.Store', {
autoLoad : true,
fields : [
{name : 'id', type : 'int'},
{name : 'month', type : 'string'}
],
data : [
{"id" : 0, "month" : "January"},
{"id" : 1, "month" : "February"},
{"id" : 2, "month" : "March"},
{"id" : 3, "month" : "April"},
{"id" : 4, "month" : "May"},
{"id" : 5, "month" : "June"},
{"id" : 6, "month" : "July"},
{"id" : 7, "month" : "August"},
{"id" : 8, "month" : "September"},
{"id" : 9, "month" : "October"},
{"id" : 10, "month" : "November"},
{"id" : 11, "month" : "December"}
]
});


var combo = Ext.create('Ext.form.ComboBox', {
forceSelection : true,
fieldLabel : 'Nice combo',
store : store,
queryMode : 'local',
displayField : 'month',
valueField : 'id',
renderTo : Ext.getBody(),
listeners : {
'change' : function(combo, newvalue, oldvalue)
{
anotherStore.load({
params : {
id : newvalue
}
});
}
}
});
}});?
?

Check it out : http://jsfiddle.net/serju/wmq6j/

vietits
7 Mar 2012, 5:25 PM
The following code works well for me with one exception is that I changed zip1, zip2, zip3 variables to 'zip1', 'zip2', 'zip3'. I use Ext 4.0.7 and Chrome.


Ext.onReady(function(){
Ext.create('widget.combobox',{
renderTo: Ext.getBody(),
id: 'zipcode',
name: 'ZipCode',
width: 300,
fieldLabel: 'Zip Code',
store: [['zip1', 'Name Zip 1'], ['zip2', 'Name Zip 2'], ['zip3', 'Name Zip 3']],
listeners: {
select: function(combo, value) { // I use select....
console.log(value);
}
}
});
});

stoneboys
9 Mar 2012, 8:22 AM
Hi chramer (http://www.sencha.com/forum/member.php?240566-chramer) .. thanks for reply , it's work for me.. And sorry for my code, absolutely i use 'displayField' and 'valueField'.., it after listeners on my code, sorry.. i just copy from firebug...