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

   1 /*
   2  * - LGPL
   3  *
   4  * Input
   5  *
   6  */
   7
   8 /**
   9  * @class Roo.bootstrap.Input
  10  * @extends Roo.bootstrap.Component
  11  * Bootstrap Input class
  12  * @cfg {Boolean} disabled is it disabled
  13  * @cfg {String} fieldLabel - the label associated
  14  * @cfg {String} inputType button | checkbox | email | file | hidden | image | number | password | radio | range | reset | search | submit | text
  15  * @cfg {String} name name of the input
  16  * @cfg {boolean} disabled is it disabled
  17  * @cfg {string} fieldLabel - the label associated
  18  * @cfg {string}  inputType - input / file submit ...
  19  * @cfg {string} placeholder - placeholder to put in text.
  20  * @cfg {string}  before - input group add on before
  21  * @cfg {string} after - input group add on after
  22  *
  23  *
  24  * @constructor
  25  * Create a new Input
  26  * @param {Object} config The config object
  27  */
  28
  29 Roo.bootstrap.Input = function(config){
  30     Roo.bootstrap.Input.superclass.constructor.call(this, config);
  31
  32 };
  33
  34 Roo.extend(Roo.bootstrap.Input, Roo.bootstrap.Component,  {
  35
  36     fieldLabel : '',
  37     inputType : 'text',
  38     disabled : false,
  39     name : false,
  40     placeholder: false,
  41     before : false,
  42     after : false,
  43
  44     getAutoCreate : function(){
  45
  46         var parent = this.parent();
  47
  48         var align = parent.labelAlign;
  49
  50         var id = Roo.id();
  51
  52         var cfg = {
  53             cls: 'form-group' //input-group
  54         };
  55
  56         var input =  {
  57             tag: 'input',
  58             id : id,
  59             type : this.inputType,
  60             cls : 'form-control',
  61             placeholder : this.placeholder || ''
  62
  63         };
  64         if (this.name) {
  65             input.name = name;
  66         }
  67
  68         var inputblock = input;
  69
  70         if (this.before || this.after) {
  71
  72             inputblock = {
  73                 cls : 'input-group',
  74                 cn :  []
  75             };
  76             if (this.before) {
  77                 inputblock.cn.push({
  78                     tag :'span',
  79                     cls : 'input-group-addon',
  80                     html : this.before
  81                 });
  82             }
  83             inputblock.cn.push(input);
  84             if (this.after) {
  85                 inputblock.cn.push({
  86                     tag :'span',
  87                     cls : 'input-group-addon',
  88                     html : this.after
  89                 });
  90             }
  91
  92         }
  93
  94         Roo.log(align);
  95         Roo.log(this.fieldLabel.length);
  96
  97         if (align ==='left' && this.fieldLabel.length) {
  98                 Roo.log("left and has label");
  99                 cfg.cn = [
 100
 101                     {
 102                         tag: 'label',
 103                         'for' :  id,
 104                         cls : 'col-sm-2 control-label',
 105                         html : this.fieldLabel
 106
 107                     },
 108                     {
 109                         cls : "col-sm-10",
 110                         cn: [
 111                             inputblock
 112                         ]
 113                     }
 114
 115                 ];
 116         } else if ( this.fieldLabel.length) {
 117                 Roo.log(" label");
 118                  cfg.cn = [
 119
 120                     {
 121                         tag: 'label',
 122                         //cls : 'input-group-addon',
 123                         html : this.fieldLabel
 124
 125                     },
 126
 127                     inputblock
 128
 129                 ];
 130
 131         } else {
 132
 133                    Roo.log(" no label && no align");
 134                 cfg.cn = [
 135
 136                         inputblock
 137
 138                 ];
 139
 140
 141         }
 142
 143
 144
 145
 146         if (this.disabled) {
 147             input.disabled=true;
 148         }
 149         return cfg;
 150
 151     },
 152     setDisabled : function(v)
 153     {
 154         var i  = this.el.select('input',true).dom;
 155         if (v) {
 156             i.removeAttribute('disabled');
 157             return;
 158
 159         }
 160         i.setAttribute('disabled','true');
 161     }
 162 });
 163
 164