git.roojs.org Git - roojs1/blob - Roo/bootstrap/Radio.js

   1 /*
   2  * - LGPL
   3  *
   4  * Radio
   5  *
   6  */
   7
   8 /**
   9  * @class Roo.bootstrap.Radio
  10  * @extends Roo.bootstrap.CheckBox
  11  * Bootstrap Radio class
  12
  13  * @constructor
  14  * Create a new Radio
  15  * @param {Object} config The config object
  16  */
  17
  18 Roo.bootstrap.Radio = function(config){
  19     Roo.bootstrap.Radio.superclass.constructor.call(this, config);
  20
  21 };
  22
  23 Roo.extend(Roo.bootstrap.Radio, Roo.bootstrap.CheckBox,  {
  24
  25     inputType: 'radio',
  26     inputValue: '',
  27     valueOff: '',
  28
  29     getAutoCreate : function()
  30     {
  31         var align = (!this.labelAlign) ? this.parentLabelAlign() : this.labelAlign;
  32
  33         var id = Roo.id();
  34
  35         var cfg = {};
  36
  37         cfg.cls = 'form-group radio' //input-group
  38
  39         var input =  {
  40             tag: 'input',
  41             id : id,
  42             type : this.inputType,
  43             //value : (!this.checked) ? this.valueOff : this.inputValue,
  44             value : this.inputValue,
  45             cls : 'roo-radio',
  46             placeholder : this.placeholder || ''
  47
  48         };
  49           if (this.weight) { // Validity check?
  50             cfg.cls += " radio-" + this.weight;
  51         }
  52         if (this.disabled) {
  53             input.disabled=true;
  54         }
  55
  56         if(this.checked){
  57             input.checked = this.checked;
  58         }
  59
  60         if (this.name) {
  61             input.name = this.name;
  62         }
  63
  64         if (this.size) {
  65             input.cls += ' input-' + this.size;
  66         }
  67
  68         var settings=this;
  69         ['xs','sm','md','lg'].map(function(size){
  70             if (settings[size]) {
  71                 cfg.cls += ' col-' + size + '-' + settings[size];
  72             }
  73         });
  74
  75         var inputblock = input;
  76
  77         if (this.before || this.after) {
  78
  79             inputblock = {
  80                 cls : 'input-group',
  81                 cn :  []
  82             };
  83             if (this.before) {
  84                 inputblock.cn.push({
  85                     tag :'span',
  86                     cls : 'input-group-addon',
  87                     html : this.before
  88                 });
  89             }
  90             inputblock.cn.push(input);
  91             if (this.after) {
  92                 inputblock.cn.push({
  93                     tag :'span',
  94                     cls : 'input-group-addon',
  95                     html : this.after
  96                 });
  97             }
  98
  99         };
 100
 101         if (align ==='left' && this.fieldLabel.length) {
 102                 Roo.log("left and has label");
 103                 cfg.cn = [
 104
 105                     {
 106                         tag: 'label',
 107                         'for' :  id,
 108                         cls : 'control-label col-md-' + this.labelWidth,
 109                         html : this.fieldLabel
 110
 111                     },
 112                     {
 113                         cls : "col-md-" + (12 - this.labelWidth),
 114                         cn: [
 115                             inputblock
 116                         ]
 117                     }
 118
 119                 ];
 120         } else if ( this.fieldLabel.length) {
 121                 Roo.log(" label");
 122                  cfg.cn = [
 123
 124                     {
 125                         tag: 'label',
 126                         'for': id,
 127                         cls: 'control-label box-input-label',
 128                         //cls : 'input-group-addon',
 129                         html : this.fieldLabel
 130
 131                     },
 132
 133                     inputblock
 134
 135                 ];
 136
 137         } else {
 138
 139                    Roo.log(" no label && no align");
 140                 cfg.cn = [
 141
 142                         inputblock
 143
 144                 ];
 145
 146
 147         };
 148
 149         if(this.boxLabel){
 150             cfg.cn.push({
 151                 tag: 'label',
 152                 'for': id,
 153                 cls: 'box-label',
 154                 html: this.boxLabel
 155             })
 156         }
 157
 158         return cfg;
 159
 160     },
 161     inputEl: function ()
 162     {
 163         return this.el.select('input.roo-radio',true).first();
 164     },
 165     onClick : function()
 166     {
 167         this.setChecked(true);
 168     },
 169
 170     setChecked : function(state,suppressEvent)
 171     {
 172         if(state){
 173             Roo.each(this.inputEl().up('form').select('input[name='+this.inputEl().dom.name+']', true).elements, function(v){
 174                 v.dom.checked = false;
 175             });
 176         }
 177
 178         this.checked = state;
 179         this.inputEl().dom.checked = state;
 180
 181         if(suppressEvent !== true){
 182             this.fireEvent('check', this, state);
 183         }
 184
 185         this.inputEl().dom.value = state ? this.inputValue : this.valueOff;
 186
 187     },
 188
 189     getGroupValue : function()
 190     {
 191         var value = ''
 192         Roo.each(this.inputEl().up('form').select('input[name='+this.inputEl().dom.name+']', true).elements, function(v){
 193             if(v.dom.checked == true){
 194                 value = v.dom.value;
 195             }
 196         });
 197
 198         return value;
 199     },
 200
 201     /**
 202      * Returns the normalized data value (undefined or emptyText will be returned as '').  To return the raw value see {@link #getRawValue}.
 203      * @return {Mixed} value The field value
 204      */
 205     getValue : function(){
 206         return this.getGroupValue();
 207     }
 208
 209 });
 210
 211