git.roojs.org Git - roojs1/blob - docs/symbols/src/Roo_bootstrap_FieldLabel.js.html

   1 <html><head><title>../roojs1/Roo/bootstrap/FieldLabel.js</title><link rel="stylesheet" type="text/css" href="../../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty"><span class="jsdoc-comment">/*
   2  * - LGPL
   3  *
   4  * FieldLabel
   5  *
   6  */
   7
   8 /**
   9  * @class Roo.bootstrap.FieldLabel
  10  * @extends Roo.bootstrap.Component
  11  * Bootstrap FieldLabel class
  12  * @cfg {String} html contents of the element
  13  * @cfg {String} tag tag of the element default label
  14  * @cfg {String} cls class of the element
  15  * @cfg {String} target label target
  16  * @cfg {Boolean} allowBlank (true|false) target allowBlank default true
  17  * @cfg {String} invalidClass default &quot;text-danger fa fa-lg fa-exclamation-triangle&quot;
  18  * @cfg {String} validClass default &quot;text-success fa fa-lg fa-check&quot;
  19  * @cfg {String} iconTooltip default &quot;This field is required&quot;
  20  *
  21  * @constructor
  22  * Create a new FieldLabel
  23  * @param {Object} config The config object
  24  */
  25
  26 </span><span class="jsdoc-var">Roo.bootstrap.FieldLabel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">){
  27     </span><span class="jsdoc-var">Roo.bootstrap.Element.superclass.constructor.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
  28
  29     </span><span class="jsdoc-var">this.addEvents</span><span class="jsdoc-syntax">({
  30             </span><span class="jsdoc-comment">/**
  31              * @event invalid
  32              * Fires after the field has been marked as invalid.
  33              * @param {Roo.form.FieldLabel} this
  34              * @param {String} msg The validation message
  35              */
  36             </span><span class="jsdoc-var">invalid </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  37             </span><span class="jsdoc-comment">/**
  38              * @event valid
  39              * Fires after the field has been validated with no errors.
  40              * @param {Roo.form.FieldLabel} this
  41              */
  42             </span><span class="jsdoc-var">valid </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
  43         </span><span class="jsdoc-syntax">});
  44 };
  45
  46 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.FieldLabel</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.Component</span><span class="jsdoc-syntax">,  {
  47
  48     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'label'</span><span class="jsdoc-syntax">,
  49     </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  50     </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  51     </span><span class="jsdoc-var">target</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  52     </span><span class="jsdoc-var">allowBlank </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  53     </span><span class="jsdoc-var">invalidClass </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'text-danger fa fa-lg fa-exclamation-triangle'</span><span class="jsdoc-syntax">,
  54     </span><span class="jsdoc-var">validClass </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'text-success fa fa-lg fa-check'</span><span class="jsdoc-syntax">,
  55     </span><span class="jsdoc-var">iconTooltip </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'This field is required'</span><span class="jsdoc-syntax">,
  56
  57     </span><span class="jsdoc-var">getAutoCreate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
  58
  59         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cfg </span><span class="jsdoc-syntax">= {
  60             </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.tag</span><span class="jsdoc-syntax">,
  61             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-bootstrap-field-label ' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.cls</span><span class="jsdoc-syntax">,
  62             </span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.target</span><span class="jsdoc-syntax">,
  63             </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
  64                 {
  65                     </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'i'</span><span class="jsdoc-syntax">,
  66                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  67                     </span><span class="jsdoc-var">tooltip </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.iconTooltip
  68                 </span><span class="jsdoc-syntax">},
  69                 {
  70                     </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
  71                     </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.html
  72                 </span><span class="jsdoc-syntax">}
  73             ]
  74         };
  75
  76         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">;
  77     },
  78
  79     </span><span class="jsdoc-var">initEvents</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
  80     {
  81         </span><span class="jsdoc-var">Roo.bootstrap.Element.superclass.initEvents.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
  82
  83         </span><span class="jsdoc-var">this.iconEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'i'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
  84
  85         </span><span class="jsdoc-var">this.iconEl.setVisibilityMode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.Element.DISPLAY</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.hide</span><span class="jsdoc-syntax">();
  86
  87         </span><span class="jsdoc-var">Roo.bootstrap.FieldLabel.register</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
  88     },
  89
  90     </span><span class="jsdoc-comment">/**
  91      * Mark this field as valid
  92      */
  93     </span><span class="jsdoc-var">markValid </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
  94     {
  95         </span><span class="jsdoc-var">this.iconEl.show</span><span class="jsdoc-syntax">();
  96
  97         </span><span class="jsdoc-var">this.iconEl.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.invalidClass</span><span class="jsdoc-syntax">);
  98
  99         </span><span class="jsdoc-var">this.iconEl.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.validClass</span><span class="jsdoc-syntax">);
 100
 101         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'valid'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 102     },
 103
 104     </span><span class="jsdoc-comment">/**
 105      * Mark this field as invalid
 106      * @param {String} msg The validation message
 107      */
 108     </span><span class="jsdoc-var">markInvalid </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">msg</span><span class="jsdoc-syntax">)
 109     {
 110         </span><span class="jsdoc-var">this.iconEl.show</span><span class="jsdoc-syntax">();
 111
 112         </span><span class="jsdoc-var">this.iconEl.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.validClass</span><span class="jsdoc-syntax">);
 113
 114         </span><span class="jsdoc-var">this.iconEl.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.invalidClass</span><span class="jsdoc-syntax">);
 115
 116         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'invalid'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">msg</span><span class="jsdoc-syntax">);
 117     }
 118
 119
 120 });
 121
 122 </span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.FieldLabel</span><span class="jsdoc-syntax">, {
 123
 124     </span><span class="jsdoc-var">groups</span><span class="jsdoc-syntax">: {},
 125
 126      </span><span class="jsdoc-comment">/**
 127     * register a FieldLabel Group
 128     * @param {Roo.bootstrap.FieldLabel} the FieldLabel to add
 129     */
 130     </span><span class="jsdoc-var">register </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">label</span><span class="jsdoc-syntax">)
 131     {
 132         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.groups.hasOwnProperty</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">label.target</span><span class="jsdoc-syntax">)){
 133             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 134         }
 135
 136         </span><span class="jsdoc-var">this.groups</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">label.target</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">label</span><span class="jsdoc-syntax">;
 137
 138     },
 139     </span><span class="jsdoc-comment">/**
 140     * fetch a FieldLabel Group based on the target
 141     * @param {string} target
 142     * @returns {Roo.bootstrap.FieldLabel} the CheckBox group
 143     */
 144     </span><span class="jsdoc-var">get</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">target</span><span class="jsdoc-syntax">) {
 145         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.groups</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">target</span><span class="jsdoc-syntax">]) == </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">) {
 146             </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 147         }
 148
 149         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.groups</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">target</span><span class="jsdoc-syntax">] ;
 150     }
 151 });
 152
 153
 154
 155  </span></code></body></html>