source/widgets/form/Label.js

   1 /*\r
   2  * Ext JS Library 2.2.1\r
   3  * Copyright(c) 2006-2009, Ext JS, LLC.\r
   4  * licensing@extjs.com\r
   5  * \r
   6  * http://extjs.com/license\r
   7  */\r
   8 \r
   9 /**\r
  10  * @class Ext.form.Label\r
  11  * @extends Ext.BoxComponent\r
  12  * Basic Label field.\r
  13  * @constructor\r
  14  * Creates a new Label\r
  15  * @param {Ext.Element/String/Object} config The configuration options.  If an element is passed, it is set as the internal\r
  16  * element and its id used as the component id.  If a string is passed, it is assumed to be the id of an existing element\r
  17  * and is used as the component id.  Otherwise, it is assumed to be a standard config object and is applied to the component.\r
  18  */\r
  19 Ext.form.Label = Ext.extend(Ext.BoxComponent, {\r
  20     /**\r
  21      * @cfg {String} text The plain text to display within the label (defaults to ''). If you need to include HTML \r
  22      * tags within the label's innerHTML, use the {@link #html} config instead.\r
  23      */\r
  24     /**\r
  25      * @cfg {String} forId The id of the input element to which this label will be bound via the standard HTML 'for'\r
  26      * attribute. If not specified, the attribute will not be added to the label.\r
  27      */\r
  28     /**\r
  29      * @cfg {String} html An HTML fragment that will be used as the label's innerHTML (defaults to ''). \r
  30      * Note that if {@link #text} is specified it will take precedence and this value will be ignored.\r
  31      */\r
  32 \r
  33     // private\r
  34     onRender : function(ct, position){\r
  35         if(!this.el){\r
  36             this.el = document.createElement('label');\r
  37             this.el.id = this.getId();\r
  38             this.el.innerHTML = this.text ? Ext.util.Format.htmlEncode(this.text) : (this.html || '');\r
  39             if(this.forId){\r
  40                 this.el.setAttribute('for', this.forId);\r
  41             }\r
  42         }\r
  43         Ext.form.Label.superclass.onRender.call(this, ct, position);\r
  44     },\r
  45     \r
  46     /**\r
  47      * Updates the label's innerHTML with the specified string.\r
  48      * @param {String} text The new label text\r
  49      * @param {Boolean} encode (optional) False to skip HTML-encoding the text when rendering it\r
  50      * to the label (defaults to true which encodes the value). This might be useful if you want to include \r
  51      * tags in the label's innerHTML rather than rendering them as string literals per the default logic.\r
  52      * @return {Label} this\r
  53      */\r
  54     setText: function(t, encode){\r
  55         this.text = t;\r
  56         if(this.rendered){\r
  57             this.el.dom.innerHTML = encode !== false ? Ext.util.Format.htmlEncode(t) : t;\r
  58         }\r
  59         return this;\r
  60     }\r
  61 });\r
  62 \r
  63 Ext.reg('label', Ext.form.Label);