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