docs/source/TextArea.html

   1 <html>\r
   2 <head>\r
   3   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    \r
   4   <title>The source code</title>\r
   5     <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
   6     <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
   7 </head>\r
   8 <body  onload="prettyPrint();">\r
   9     <pre class="prettyprint lang-js"><div id="cls-Ext.form.TextArea"></div>/**
  10  * @class Ext.form.TextArea
  11  * @extends Ext.form.TextField
  12  * Multiline text field.  Can be used as a direct replacement for traditional textarea fields, plus adds
  13  * support for auto-sizing.
  14  * @constructor
  15  * Creates a new TextArea
  16  * @param {Object} config Configuration options
  17  * @xtype textarea
  18  */
  19 Ext.form.TextArea = Ext.extend(Ext.form.TextField,  {
  20     <div id="cfg-Ext.form.TextArea-growMin"></div>/**
  21      * @cfg {Number} growMin The minimum height to allow when <tt>{@link Ext.form.TextField#grow grow}=true</tt>
  22      * (defaults to <tt>60</tt>)
  23      */
  24     growMin : 60,
  25     <div id="cfg-Ext.form.TextArea-growMax"></div>/**
  26      * @cfg {Number} growMax The maximum height to allow when <tt>{@link Ext.form.TextField#grow grow}=true</tt>
  27      * (defaults to <tt>1000</tt>)
  28      */
  29     growMax: 1000,
  30     growAppend : '&#160;\n&#160;',
  31
  32     enterIsSpecial : false,
  33
  34     <div id="cfg-Ext.form.TextArea-preventScrollbars"></div>/**
  35      * @cfg {Boolean} preventScrollbars <tt>true</tt> to prevent scrollbars from appearing regardless of how much text is
  36      * in the field. This option is only relevant when {@link #grow} is <tt>true</tt>. Equivalent to setting overflow: hidden, defaults to
  37      * <tt>false</tt>.
  38      */
  39     preventScrollbars: false,
  40     <div id="cfg-Ext.form.TextArea-autoCreate"></div>/**
  41      * @cfg {String/Object} autoCreate <p>A {@link Ext.DomHelper DomHelper} element spec, or true for a default
  42      * element spec. Used to create the {@link Ext.Component#getEl Element} which will encapsulate this Component.
  43      * See <tt>{@link Ext.Component#autoEl autoEl}</tt> for details.  Defaults to:</p>
  44      * <pre><code>{tag: "textarea", style: "width:100px;height:60px;", autocomplete: "off"}</code></pre>
  45      */
  46
  47     // private
  48     onRender : function(ct, position){
  49         if(!this.el){
  50             this.defaultAutoCreate = {
  51                 tag: "textarea",
  52                 style:"width:100px;height:60px;",
  53                 autocomplete: "off"
  54             };
  55         }
  56         Ext.form.TextArea.superclass.onRender.call(this, ct, position);
  57         if(this.grow){
  58             this.textSizeEl = Ext.DomHelper.append(document.body, {
  59                 tag: "pre", cls: "x-form-grow-sizer"
  60             });
  61             if(this.preventScrollbars){
  62                 this.el.setStyle("overflow", "hidden");
  63             }
  64             this.el.setHeight(this.growMin);
  65         }
  66     },
  67
  68     onDestroy : function(){
  69         Ext.removeNode(this.textSizeEl);
  70         Ext.form.TextArea.superclass.onDestroy.call(this);
  71     },
  72
  73     fireKey : function(e){
  74         if(e.isSpecialKey() && (this.enterIsSpecial || (e.getKey() != e.ENTER || e.hasModifier()))){
  75             this.fireEvent("specialkey", this, e);
  76         }
  77     },
  78
  79     // private
  80     doAutoSize : function(e){
  81         return !e.isNavKeyPress() || e.getKey() == e.ENTER;
  82     },
  83
  84     <div id="method-Ext.form.TextArea-autoSize"></div>/**
  85      * Automatically grows the field to accomodate the height of the text up to the maximum field height allowed.
  86      * This only takes effect if grow = true, and fires the {@link #autosize} event if the height changes.
  87      */
  88     autoSize: function(){
  89         if(!this.grow || !this.textSizeEl){
  90             return;
  91         }
  92         var el = this.el,
  93             v = Ext.util.Format.htmlEncode(el.dom.value),
  94             ts = this.textSizeEl,
  95             h;
  96
  97         Ext.fly(ts).setWidth(this.el.getWidth());
  98         if(v.length < 1){
  99             v = "&#160;&#160;";
 100         }else{
 101             v += this.growAppend;
 102             if(Ext.isIE){
 103                 v = v.replace(/\n/g, '&#160;<br />');
 104             }
 105         }
 106         ts.innerHTML = v;
 107         h = Math.min(this.growMax, Math.max(ts.offsetHeight, this.growMin));
 108         if(h != this.lastHeight){
 109             this.lastHeight = h;
 110             this.el.setHeight(h);
 111             this.fireEvent("autosize", this, h);
 112         }
 113     }
 114 });
 115 Ext.reg('textarea', Ext.form.TextArea);</pre>    \r
 116 </body>\r
 117 </html>