* @cfg {String} cls class of the element
* @cfg {String} target label target
* @cfg {Boolean} allowBlank (true|false) target allowBlank default true
- * @cfg {String} invalidClass default "text-warning"
- * @cfg {String} validClass default "text-success"
+ * @cfg {String} invalidClass DEPRICATED - BS4 uses is-invalid
+ * @cfg {String} validClass DEPRICATED - BS4 uses is-valid
* @cfg {String} iconTooltip default "This field is required"
* @cfg {String} indicatorpos (left|right) default left
*
iconTooltip : 'This field is required',
indicatorpos : 'left',
- getAutoCreate : function()
- {
+ getAutoCreate : function(){
+
+ var cls = "";
+ if (!this.allowBlank) {
+ cls = "visible";
+ }
+
var cfg = {
tag : this.tag,
cls : 'roo-bootstrap-field-label ' + this.cls,
for : this.target,
cn : [
+ {
+ tag : 'i',
+ cls : 'roo-required-indicator left-indicator text-danger fa fa-lg fa-star ' + cls,
+ tooltip : this.iconTooltip
+ },
{
tag : 'span',
html : this.html
]
};
- if(!this.allowBlank){
-
+ if(this.indicatorpos == 'right'){
var cfg = {
tag : this.tag,
cls : 'roo-bootstrap-field-label ' + this.cls,
for : this.target,
cn : [
- {
- tag : 'i',
- cls : 'roo-required-indicator left-indicator text-danger fa fa-lg fa-star ' + cls,
- tooltip : this.iconTooltip
- },
{
tag : 'span',
html : this.html
+ },
+ {
+ tag : 'i',
+ cls : 'roo-required-indicator right-indicator text-danger fa fa-lg fa-star '+ cls,
+ tooltip : this.iconTooltip
}
]
};
-
- if(this.indicatorpos == 'right'){
- var cfg = {
- tag : this.tag,
- cls : 'roo-bootstrap-field-label ' + this.cls,
- for : this.target,
- cn : [
- {
- tag : 'span',
- html : this.html
- },
- {
- tag : 'i',
- cls : 'roo-required-indicator right-indicator text-danger fa fa-lg fa-star '+ cls,
- tooltip : this.iconTooltip
- }
- ]
- };
- }
}
-
+
return cfg;
},
this.indicator.removeClass('visible');
this.indicator.addClass('invisible');
}
+ if (Roo.bootstrap.version == 3) {
+ this.el.removeClass(this.invalidClass);
+ this.el.addClass(this.validClass);
+ } else {
+ this.el.removeClass('is-invalid');
+ this.el.addClass('is-valid');
+ }
- this.el.removeClass(this.invalidClass);
-
- this.el.addClass(this.validClass);
this.fireEvent('valid', this);
},
this.indicator.removeClass('invisible');
this.indicator.addClass('visible');
}
+ if (Roo.bootstrap.version == 3) {
+ this.el.removeClass(this.validClass);
+ this.el.addClass(this.invalidClass);
+ } else {
+ this.el.removeClass('is-valid');
+ this.el.addClass('is-invalid');
+ }
- this.el.removeClass(this.validClass);
-
- this.el.addClass(this.invalidClass);
this.fireEvent('invalid', this, msg);
}