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

   1 /*
   2  * - LGPL
   3  *
   4  * Input
   5  *
   6  */
   7
   8 /**
   9  * @class Roo.bootstrap.TextArea
  10  * @extends Roo.bootstrap.Input
  11  * Bootstrap TextArea class
  12  * @cfg {Number} cols Specifies the visible width of a text area
  13  * @cfg {Number} rows Specifies the visible number of lines in a text area
  14  * @cfg {Number} readOnly Specifies that a text area should be read-only
  15  * @cfg {string} wrap (soft|hard)Specifies how the text in a text area is to be wrapped when submitted in a form
  16  *
  17  * @constructor
  18  * Create a new TextArea
  19  * @param {Object} config The config object
  20  */
  21
  22 Roo.bootstrap.TextArea = function(config){
  23     Roo.bootstrap.TextArea.superclass.constructor.call(this, config);
  24
  25 };
  26
  27 Roo.extend(Roo.bootstrap.TextArea, Roo.bootstrap.Input,  {
  28
  29     cols : false,
  30     rows : 5,
  31     readOnly : false,
  32     warp : 'soft',
  33
  34     getAutoCreate : function(){
  35
  36         var parent = this.parent();
  37
  38         var align = parent.labelAlign;
  39
  40         var id = Roo.id();
  41
  42         var cfg = {};
  43
  44         var input =  {
  45             tag: 'textarea',
  46             id : id,
  47             warp : this.warp,
  48             rows : this.rows,
  49             value : this.value,
  50             style : "resize:none",
  51             cls : 'form-control',
  52             placeholder : this.placeholder || ''
  53
  54         };
  55
  56         if(this.cols){
  57             input.cols = this.cols;
  58         }
  59
  60         if (this.readOnly) {
  61             input.readonly = true;
  62         }
  63
  64         if (this.name) {
  65             input.name = this.name;
  66         }
  67
  68         if (this.size) {
  69             input.cls += ' input-' + this.size;
  70         }
  71
  72         var settings=this;
  73         ['xs','sm','md','lg'].map(function(size){
  74             if (settings[size]) {
  75                 cfg.cls += ' col-' + size + '-' + settings[size];
  76             }
  77         });
  78
  79         var inputblock = input;
  80
  81         if (this.before || this.after) {
  82
  83             inputblock = {
  84                 cls : 'input-group',
  85                 cn :  []
  86             };
  87             if (this.before) {
  88                 inputblock.cn.push({
  89                     tag :'span',
  90                     cls : 'input-group-addon',
  91                     html : this.before
  92                 });
  93             }
  94             inputblock.cn.push(input);
  95             if (this.after) {
  96                 inputblock.cn.push({
  97                     tag :'span',
  98                     cls : 'input-group-addon',
  99                     html : this.after
 100                 });
 101             }
 102
 103         }
 104
 105         if (align ==='left' && this.fieldLabel.length) {
 106                 Roo.log("left and has label");
 107                 cfg.cn = [
 108
 109                     {
 110                         tag: 'label',
 111                         'for' :  id,
 112                         cls : 'control-label col-sm-' + this.labelWidth,
 113                         html : this.fieldLabel
 114
 115                     },
 116                     {
 117                         cls : "col-sm-" + (12 - this.labelWidth),
 118                         cn: [
 119                             inputblock
 120                         ]
 121                     }
 122
 123                 ];
 124         } else if ( this.fieldLabel.length) {
 125                 Roo.log(" label");
 126                  cfg.cn = [
 127
 128                     {
 129                         tag: 'label',
 130                         //cls : 'input-group-addon',
 131                         html : this.fieldLabel
 132
 133                     },
 134
 135                     inputblock
 136
 137                 ];
 138
 139         } else {
 140
 141                    Roo.log(" no label && no align");
 142                 cfg.cn = [
 143
 144                         inputblock
 145
 146                 ];
 147
 148
 149         }
 150
 151         if (this.disabled) {
 152             input.disabled=true;
 153         }
 154
 155         return cfg;
 156
 157     },
 158     /**
 159      * return the real textarea element.
 160      */
 161     inputEl: function ()
 162     {
 163         return this.el.select('textarea.form-control',true).first();
 164     }
 165 });
 166
 167