PDA

View Full Version : radiogroup error



sofway
23 Apr 2010, 12:52 PM
Hi,
It seems that this component has an error. I hava a radiogroup defined with a change listener. When i check some of the radios, it lost the change event.

{
xtype: 'radiogroup',
id: 'id_group',
listeners: {
'change': function(element, checked){
alert(checked.inputValue);
}
},
items: [
{id: 'radio1', boxLabel: 'Label1', name: 'group1', inputValue: 'no', checked:true},
{id: 'radio2', boxLabel: 'Label2', name: 'group1', inputValue: 'yes'}
]
}

It works fine, but when i use
Ext.getCmp('radio1').setValue(true);
The change event stop working.

How can i set a radio without breaking the change event?
Thanks

mpawlowski
24 Apr 2010, 8:13 AM
You dont want to set the value of a single radio element in the group, but rather set the value of a radio element to the radio group.

Ext.getCmp('id_group').setValue('yes')

sofway
24 Apr 2010, 8:20 AM
Thanks mpawlowski,

the error is the same, If you change the value using the rariogroup id, the change event get lost.

This error is getting my crazy! :S

mpawlowski
24 Apr 2010, 8:29 AM
hmm...setting the input value through the radio group worked fine for me, which browser are you using?

edit: whats the error you are seeing?

sofway
24 Apr 2010, 8:40 AM
please check the example. It doesnt work in Chrome, Firefox 3.6 and IE8
Help!

mpawlowski
24 Apr 2010, 8:45 AM
here is an example that works


<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>TestApplication</title>
<link rel="stylesheet" type="text/css" href="http://extjs-public.googlecode.com/svn/tags/extjs-3.1.1/release/resources/css/ext-all.css" />
<script type="text/javascript" src="http://extjs-public.googlecode.com/svn/tags/extjs-3.1.1/release/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="http://extjs-public.googlecode.com/svn/tags/extjs-3.1.1/release/ext-all-debug.js"></script>
<script type="text/javascript" src="js/monthpicker.js"></script>
<script>
Ext.onReady(function(){
var win = new Ext.Window({
width: 300,
height: 300,
title: 'foo',
layout: 'fit',
items: [{
xtype: 'radiogroup',
id: 'id_group',
region: 'center',
listeners: {
'change': function(element, checked){
alert(checked.inputValue);
}
},
items: [{
id: 'radio1',
boxLabel: 'Label1',
name: 'group1',
inputValue: 'no',
checked: true
}, {
id: 'radio2',
boxLabel: 'Label2',
name: 'group1',
inputValue: 'yes'
}]
}],

buttons: [{
text: 'foo',
handler: function(){
Ext.getCmp('id_group').setValue('yes');
}
}]

});
win.show();
})
</script>
</head>
<body>
</body>
</html>