10 <input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked>
11 Option one is this and that—be sure to include why it's great
18 *<label class="radio-inline">fieldLabel</label>
19 *<label class="radio-inline">
20 <input type="radio" name="inlineRadioOptions" id="inlineRadio1" value="option1"> 1
28 * @class Roo.bootstrap.Radio
29 * @extends Roo.bootstrap.CheckBox
30 * Bootstrap Radio class
34 * @param {Object} config The config object
37 Roo.bootstrap.Radio = function(config){
38 Roo.bootstrap.Radio.superclass.constructor.call(this, config);
42 Roo.extend(Roo.bootstrap.Radio, Roo.bootstrap.CheckBox, {
48 getAutoCreate : function()
50 var align = (!this.labelAlign) ? this.parentLabelAlign() : this.labelAlign;
51 align = align || 'left'; // default...
58 tag : this.inline ? 'span' : 'div',
63 var inline = this.inline ? ' radio-inline' : '';
67 // does not need for, as we wrap the input with it..
69 cls : 'control-label box-label' + inline,
72 var labelWidth = this.labelWidth ? this.labelWidth *1 : 100;
76 //cls : 'control-label' + inline,
77 html : this.fieldLabel,
78 style : 'width:' + labelWidth + 'px;line-height:1;vertical-align:bottom;cursor:default;' // should be css really.
84 type : this.inputType,
85 //value : (!this.checked) ? this.valueOff : this.inputValue,
86 value : this.inputValue,
88 placeholder : this.placeholder || '' // ?? needed????
91 if (this.weight) { // Validity check?
92 input.cls += " radio-" + this.weight;
99 input.checked = this.checked;
103 input.name = this.name;
107 input.cls += ' input-' + this.size;
110 //?? can span's inline have a width??
113 ['xs','sm','md','lg'].map(function(size){
114 if (settings[size]) {
115 cfg.cls += ' col-' + size + '-' + settings[size];
119 var inputblock = input;
121 if (this.before || this.after) {
131 cls : 'input-group-addon',
135 inputblock.cn.push(input);
139 cls : 'input-group-addon',
147 if (this.fieldLabel && this.fieldLabel.length) {
148 cfg.cn.push(fieldLabel);
151 // normal bootstrap puts the input inside the label.
152 // however with our styled version - it has to go after the input.
154 //lbl.cn.push(inputblock);
158 cls: 'radio' + inline,
165 cfg.cn.push( lblwrap);
179 initEvents : function()
181 // Roo.bootstrap.CheckBox.superclass.initEvents.call(this);
183 this.inputEl().on('click', this.onClick, this);
185 //Roo.log('find label');
186 this.el.select('span.radio label span',true).first().on('click', this.onClick, this);
193 return this.el.select('input.roo-radio',true).first();
198 this.setChecked(true);
201 setChecked : function(state,suppressEvent)
204 Roo.each(this.inputEl().up('form').select('input[name='+this.inputEl().dom.name+']', true).elements, function(v){
205 v.dom.checked = false;
208 this.checked = state;
209 this.inputEl().dom.checked = state;
211 if(suppressEvent !== true){
212 this.fireEvent('check', this, state);
214 //this.inputEl().dom.value = state ? this.inputValue : this.valueOff;
215 Roo.log('validating: '+this.name);
219 getGroupValue : function()
222 Roo.each(this.inputEl().up('form').select('input[name='+this.inputEl().dom.name+']', true).elements, function(v){
223 if(v.dom.checked == true){
232 * Returns the normalized data value (undefined or emptyText will be returned as ''). To return the raw value see {@link #getRawValue}.
233 * @return {Mixed} value The field value
235 getValue : function(){
236 return this.getGroupValue();