From: Alan Knowles Date: Fri, 30 Jul 2021 07:11:24 +0000 (+0800) Subject: MOVED Roo/bootstrap/Radio.js to Roo/bootstrap/form/Radio.js X-Git-Url: http://git.roojs.org/?p=roojs1;a=commitdiff_plain;h=1562bb2a58c9fdf38c743077762601e2f3f63659 MOVED Roo/bootstrap/Radio.js to Roo/bootstrap/form/Radio.js MOVED Roo/bootstrap/RadioSet.js to Roo/bootstrap/form/RadioSet.js Roo/bootstrap/Radio.js Roo/bootstrap/RadioSet.js --- diff --git a/Roo/bootstrap/form/Radio.js b/Roo/bootstrap/form/Radio.js new file mode 100644 index 0000000000..cddcdd1169 --- /dev/null +++ b/Roo/bootstrap/form/Radio.js @@ -0,0 +1,80 @@ +/* + * - LGPL + * + * RadioItem + * + */ + +/** + * @class Roo.bootstrap.Radio + * @extends Roo.bootstrap.Component + * Bootstrap Radio class + * @cfg {String} boxLabel - the label associated + * @cfg {String} value - the value of radio + * + * @constructor + * Create a new Radio + * @param {Object} config The config object + */ +Roo.bootstrap.Radio = function(config){ + Roo.bootstrap.Radio.superclass.constructor.call(this, config); + +}; + +Roo.extend(Roo.bootstrap.Radio, Roo.bootstrap.Component, { + + boxLabel : '', + + value : '', + + getAutoCreate : function() + { + var cfg = { + tag : 'div', + cls : 'form-group radio', + cn : [ + { + tag : 'label', + cls : 'box-label', + html : this.boxLabel + } + ] + }; + + return cfg; + }, + + initEvents : function() + { + this.parent().register(this); + + this.el.on('click', this.onClick, this); + + }, + + onClick : function(e) + { + if(this.parent().fireEvent('click', this.parent(), this, e) !== false){ + this.setChecked(true); + } + }, + + setChecked : function(state, suppressEvent) + { + this.parent().setValue(this.value, suppressEvent); + + }, + + setBoxLabel : function(v) + { + this.boxLabel = v; + + if(this.rendered){ + this.el.select('label.box-label',true).first().dom.innerHTML = (v === null || v === undefined ? '' : v); + } + } + +}); + + + \ No newline at end of file diff --git a/Roo/bootstrap/form/RadioSet.js b/Roo/bootstrap/form/RadioSet.js new file mode 100644 index 0000000000..b654347abd --- /dev/null +++ b/Roo/bootstrap/form/RadioSet.js @@ -0,0 +1,344 @@ +/* + * - LGPL + * + * RadioSet + * + * + */ + +/** + * @class Roo.bootstrap.RadioSet + * @extends Roo.bootstrap.Input + * @children Roo.bootstrap.Radio + * Bootstrap RadioSet class + * @cfg {String} indicatorpos (left|right) default left + * @cfg {Boolean} inline (true|false) inline the element (default true) + * @cfg {String} weight (primary|warning|info|danger|success) The text that appears beside the radio + * @constructor + * Create a new RadioSet + * @param {Object} config The config object + */ + +Roo.bootstrap.RadioSet = function(config){ + + Roo.bootstrap.RadioSet.superclass.constructor.call(this, config); + + this.radioes = []; + + Roo.bootstrap.RadioSet.register(this); + + this.addEvents({ + /** + * @event check + * Fires when the element is checked or unchecked. + * @param {Roo.bootstrap.RadioSet} this This radio + * @param {Roo.bootstrap.Radio} item The checked item + */ + check : true, + /** + * @event click + * Fires when the element is click. + * @param {Roo.bootstrap.RadioSet} this This radio set + * @param {Roo.bootstrap.Radio} item The checked item + * @param {Roo.EventObject} e The event object + */ + click : true + }); + +}; + +Roo.extend(Roo.bootstrap.RadioSet, Roo.bootstrap.Input, { + + radioes : false, + + inline : true, + + weight : '', + + indicatorpos : 'left', + + getAutoCreate : function() + { + var label = { + tag : 'label', + cls : 'roo-radio-set-label', + cn : [ + { + tag : 'span', + html : this.fieldLabel + } + ] + }; + if (Roo.bootstrap.version == 3) { + + + if(this.indicatorpos == 'left'){ + label.cn.unshift({ + tag : 'i', + cls : 'roo-required-indicator left-indicator text-danger fa fa-lg fa-star', + tooltip : 'This field is required' + }); + } else { + label.cn.push({ + tag : 'i', + cls : 'roo-required-indicator right-indicator text-danger fa fa-lg fa-star', + tooltip : 'This field is required' + }); + } + } + var items = { + tag : 'div', + cls : 'roo-radio-set-items' + }; + + var align = (!this.labelAlign) ? this.parentLabelAlign() : this.labelAlign; + + if (align === 'left' && this.fieldLabel.length) { + + items = { + cls : "roo-radio-set-right", + cn: [ + items + ] + }; + + if(this.labelWidth > 12){ + label.style = "width: " + this.labelWidth + 'px'; + } + + if(this.labelWidth < 13 && this.labelmd == 0){ + this.labelmd = this.labelWidth; + } + + if(this.labellg > 0){ + label.cls += ' col-lg-' + this.labellg; + items.cls += ' col-lg-' + (12 - this.labellg); + } + + if(this.labelmd > 0){ + label.cls += ' col-md-' + this.labelmd; + items.cls += ' col-md-' + (12 - this.labelmd); + } + + if(this.labelsm > 0){ + label.cls += ' col-sm-' + this.labelsm; + items.cls += ' col-sm-' + (12 - this.labelsm); + } + + if(this.labelxs > 0){ + label.cls += ' col-xs-' + this.labelxs; + items.cls += ' col-xs-' + (12 - this.labelxs); + } + } + + var cfg = { + tag : 'div', + cls : 'roo-radio-set', + cn : [ + { + tag : 'input', + cls : 'roo-radio-set-input', + type : 'hidden', + name : this.name, + value : this.value ? this.value : '' + }, + label, + items + ] + }; + + if(this.weight.length){ + cfg.cls += ' roo-radio-' + this.weight; + } + + if(this.inline) { + cfg.cls += ' roo-radio-set-inline'; + } + + var settings=this; + ['xs','sm','md','lg'].map(function(size){ + if (settings[size]) { + cfg.cls += ' col-' + size + '-' + settings[size]; + } + }); + + return cfg; + + }, + + initEvents : function() + { + this.labelEl = this.el.select('.roo-radio-set-label', true).first(); + this.labelEl.setVisibilityMode(Roo.Element.DISPLAY); + + if(!this.fieldLabel.length){ + this.labelEl.hide(); + } + + this.itemsEl = this.el.select('.roo-radio-set-items', true).first(); + this.itemsEl.setVisibilityMode(Roo.Element.DISPLAY); + + this.indicator = this.indicatorEl(); + + if(this.indicator){ + this.indicator.addClass('invisible'); + } + + this.originalValue = this.getValue(); + + }, + + inputEl: function () + { + return this.el.select('.roo-radio-set-input', true).first(); + }, + + getChildContainer : function() + { + return this.itemsEl; + }, + + register : function(item) + { + this.radioes.push(item); + + }, + + validate : function() + { + if(this.getVisibilityEl().hasClass('hidden')){ + return true; + } + + var valid = false; + + Roo.each(this.radioes, function(i){ + if(!i.checked){ + return; + } + + valid = true; + return false; + }); + + if(this.allowBlank) { + return true; + } + + if(this.disabled || valid){ + this.markValid(); + return true; + } + + this.markInvalid(); + return false; + + }, + + markValid : function() + { + if(this.labelEl.isVisible(true) && this.indicatorEl()){ + this.indicatorEl().removeClass('visible'); + this.indicatorEl().addClass('invisible'); + } + + + if (Roo.bootstrap.version == 3) { + this.el.removeClass([this.invalidClass, this.validClass]); + this.el.addClass(this.validClass); + } else { + this.el.removeClass(['is-invalid','is-valid']); + this.el.addClass(['is-valid']); + } + this.fireEvent('valid', this); + }, + + markInvalid : function(msg) + { + if(this.allowBlank || this.disabled){ + return; + } + + if(this.labelEl.isVisible(true) && this.indicatorEl()){ + this.indicatorEl().removeClass('invisible'); + this.indicatorEl().addClass('visible'); + } + if (Roo.bootstrap.version == 3) { + this.el.removeClass([this.invalidClass, this.validClass]); + this.el.addClass(this.invalidClass); + } else { + this.el.removeClass(['is-invalid','is-valid']); + this.el.addClass(['is-invalid']); + } + + this.fireEvent('invalid', this, msg); + + }, + + setValue : function(v, suppressEvent) + { + if(this.value === v){ + return; + } + + this.value = v; + + if(this.rendered){ + this.inputEl().dom.value = (v === null || v === undefined ? '' : v); + } + + Roo.each(this.radioes, function(i){ + i.checked = false; + i.el.removeClass('checked'); + }); + + Roo.each(this.radioes, function(i){ + + if(i.value === v || i.value.toString() === v.toString()){ + i.checked = true; + i.el.addClass('checked'); + + if(suppressEvent !== true){ + this.fireEvent('check', this, i); + } + + return false; + } + + }, this); + + this.validate(); + }, + + clearInvalid : function(){ + + if(!this.el || this.preventMark){ + return; + } + + this.el.removeClass([this.invalidClass]); + + this.fireEvent('valid', this); + } + +}); + +Roo.apply(Roo.bootstrap.RadioSet, { + + groups: {}, + + register : function(set) + { + this.groups[set.name] = set; + }, + + get: function(name) + { + if (typeof(this.groups[name]) == 'undefined') { + return false; + } + + return this.groups[name] ; + } + +});