I've followed the basic procedures for obtaining the selected value of my radio button form.
....
xtype: 'radiofield',
name: 'timespan',
id: 'timespan',
value: 7,
checked: true,
fieldLabel: 'Time Span',
boxLabel: '7 days'
}, {
xtype: 'radiofield',
name: 'timespan',
value: '30',
fieldLabel: '',
labelSeparator: '',
hideEmptyLabel: false,
boxLabel: '30 days'
}, {
xtype: 'radiofield',
name: 'timespan',
value: '60',
fieldLabel: '',
labelSeparator: '',
hideEmptyLabel: false,
boxLabel: '60 days'
}, {
xtype: 'radiofield',
name: 'timespan',
value: 'all',
fieldLabel: '',
labelSeparator: '',
hideEmptyLabel: false,
boxLabel: 'All' ....
I've used methods like:
Ext.getCmp('filter_form').getForm().getValues()['timespan']
But when I run this to the console, instead of getting the value of the selected button, I get the word on
. What gives?! I've tried several different combos of getValues, getForm, etc, but I always end up with on
or true
or false
. What's going on here?
Using Input Radio checked property: The Input Radio checked property is used to return the checked status of an Input Radio Button. Use document. getElementById('id'). checked method to check whether the element with selected id is check or not.
We can check the status of a radio button by using the :checked jQuery selector together with the jQuery function is . For example: $('#el').is(':checked') . It is exactly the same method we use to check when a checkbox is checked using jQuery.
To validate radio button and checkbox, we need to use Validators from @angular/forms library. It is used while instantiating FormGroup . userForm = new FormGroup({ gender: new FormControl('', Validators. required), tc: new FormControl('', Validators.
try setting inputValue
property of radio. Which is the value that should go into the generated input element's value attribute and should be used as the parameter value when submitting as part of a form.
{
xtype : 'radiofield',
name : 'timespan',
inputValue : '30',
hideEmptyLabel : false,
boxLabel : '30 days'
}
then it can be accessed as
Ext.ComponentQuery.query('[name=timespan]')[0].getGroupValue();
refer docs getGroupValue
Figured it out! Turns out that my extjs sample code has an error!
I changed value
to inputValue
. Taken from the Sencha Docs, inputValue
is:
The value that should go into the generated input element's value attribute and should be used as the parameter value when submitting as part of a form. Defaults to: 'on'
Aha!! Because I hadn't specified a "real" value, it defaulted to on
.
Be careful when using the extjs examples/sample code!
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With