10 * @class Roo.bootstrap.RadioSet
11 * @extends Roo.bootstrap.Input
12 * @children Roo.bootstrap.Radio
13 * Bootstrap RadioSet class
14 * @cfg {String} indicatorpos (left|right) default left
15 * @cfg {Boolean} inline (true|false) inline the element (default true)
16 * @cfg {String} weight (primary|warning|info|danger|success) The text that appears beside the radio
18 * Create a new RadioSet
19 * @param {Object} config The config object
22 Roo.bootstrap.RadioSet = function(config){
24 Roo.bootstrap.RadioSet.superclass.constructor.call(this, config);
28 Roo.bootstrap.RadioSet.register(this);
33 * Fires when the element is checked or unchecked.
34 * @param {Roo.bootstrap.RadioSet} this This radio
35 * @param {Roo.bootstrap.Radio} item The checked item
40 * Fires when the element is click.
41 * @param {Roo.bootstrap.RadioSet} this This radio set
42 * @param {Roo.bootstrap.Radio} item The checked item
43 * @param {Roo.EventObject} e The event object
50 Roo.extend(Roo.bootstrap.RadioSet, Roo.bootstrap.Input, {
58 indicatorpos : 'left',
60 getAutoCreate : function()
64 cls : 'roo-radio-set-label',
68 html : this.fieldLabel
72 if (Roo.bootstrap.version == 3) {
75 if(this.indicatorpos == 'left'){
78 cls : 'roo-required-indicator left-indicator text-danger fa fa-lg fa-star',
79 tooltip : 'This field is required'
84 cls : 'roo-required-indicator right-indicator text-danger fa fa-lg fa-star',
85 tooltip : 'This field is required'
91 cls : 'roo-radio-set-items'
94 var align = (!this.labelAlign) ? this.parentLabelAlign() : this.labelAlign;
96 if (align === 'left' && this.fieldLabel.length) {
99 cls : "roo-radio-set-right",
105 if(this.labelWidth > 12){
106 label.style = "width: " + this.labelWidth + 'px';
109 if(this.labelWidth < 13 && this.labelmd == 0){
110 this.labelmd = this.labelWidth;
113 if(this.labellg > 0){
114 label.cls += ' col-lg-' + this.labellg;
115 items.cls += ' col-lg-' + (12 - this.labellg);
118 if(this.labelmd > 0){
119 label.cls += ' col-md-' + this.labelmd;
120 items.cls += ' col-md-' + (12 - this.labelmd);
123 if(this.labelsm > 0){
124 label.cls += ' col-sm-' + this.labelsm;
125 items.cls += ' col-sm-' + (12 - this.labelsm);
128 if(this.labelxs > 0){
129 label.cls += ' col-xs-' + this.labelxs;
130 items.cls += ' col-xs-' + (12 - this.labelxs);
136 cls : 'roo-radio-set',
140 cls : 'roo-radio-set-input',
143 value : this.value ? this.value : ''
150 if(this.weight.length){
151 cfg.cls += ' roo-radio-' + this.weight;
155 cfg.cls += ' roo-radio-set-inline';
159 ['xs','sm','md','lg'].map(function(size){
160 if (settings[size]) {
161 cfg.cls += ' col-' + size + '-' + settings[size];
169 initEvents : function()
171 this.labelEl = this.el.select('.roo-radio-set-label', true).first();
172 this.labelEl.setVisibilityMode(Roo.Element.DISPLAY);
174 if(!this.fieldLabel.length){
178 this.itemsEl = this.el.select('.roo-radio-set-items', true).first();
179 this.itemsEl.setVisibilityMode(Roo.Element.DISPLAY);
181 this.indicator = this.indicatorEl();
184 this.indicator.addClass('invisible');
187 this.originalValue = this.getValue();
193 return this.el.select('.roo-radio-set-input', true).first();
196 getChildContainer : function()
201 register : function(item)
203 this.radioes.push(item);
207 validate : function()
209 if(this.getVisibilityEl().hasClass('hidden')){
215 Roo.each(this.radioes, function(i){
224 if(this.allowBlank) {
228 if(this.disabled || valid){
238 markValid : function()
240 if(this.labelEl.isVisible(true) && this.indicatorEl()){
241 this.indicatorEl().removeClass('visible');
242 this.indicatorEl().addClass('invisible');
246 if (Roo.bootstrap.version == 3) {
247 this.el.removeClass([this.invalidClass, this.validClass]);
248 this.el.addClass(this.validClass);
250 this.el.removeClass(['is-invalid','is-valid']);
251 this.el.addClass(['is-valid']);
253 this.fireEvent('valid', this);
256 markInvalid : function(msg)
258 if(this.allowBlank || this.disabled){
262 if(this.labelEl.isVisible(true) && this.indicatorEl()){
263 this.indicatorEl().removeClass('invisible');
264 this.indicatorEl().addClass('visible');
266 if (Roo.bootstrap.version == 3) {
267 this.el.removeClass([this.invalidClass, this.validClass]);
268 this.el.addClass(this.invalidClass);
270 this.el.removeClass(['is-invalid','is-valid']);
271 this.el.addClass(['is-invalid']);
274 this.fireEvent('invalid', this, msg);
278 setValue : function(v, suppressEvent)
280 if(this.value === v){
287 this.inputEl().dom.value = (v === null || v === undefined ? '' : v);
290 Roo.each(this.radioes, function(i){
292 i.el.removeClass('checked');
295 Roo.each(this.radioes, function(i){
297 if(i.value === v || i.value.toString() === v.toString()){
299 i.el.addClass('checked');
301 if(suppressEvent !== true){
302 this.fireEvent('check', this, i);
313 clearInvalid : function(){
315 if(!this.el || this.preventMark){
319 this.el.removeClass([this.invalidClass]);
321 this.fireEvent('valid', this);
326 Roo.apply(Roo.bootstrap.RadioSet, {
330 register : function(set)
332 this.groups[set.name] = set;
337 if (typeof(this.groups[name]) == 'undefined') {
341 return this.groups[name] ;