* @cfg {Boolean} checked initnal the element
* @cfg {Boolean} inline inline the element (default false)
* @cfg {String} groupId the checkbox group id // normal just use for checkbox
+ * @cfg {String} tooltip label tooltip
*
* @constructor
* Create a new CheckBox
* @param {Roo.bootstrap.CheckBox} this This input
* @param {Boolean} checked The new checked value
*/
- check : true
+ check : true,
+ /**
+ * @event click
+ * Fires when the element is click.
+ * @param {Roo.bootstrap.CheckBox} this This input
+ */
+ click : true
});
};
checked: false,
weight : false,
inline: false,
+ tooltip : '',
+
+ // checkbox success does not make any sense really..
+ invalidClass : "",
+ validClass : "",
+
getAutoCreate : function()
{
var cfg = {};
- cfg.cls = 'form-group ' + this.inputType; //input-group
+ cfg.cls = 'form-group form-check ' + this.inputType; //input-group
if(this.inline){
- cfg.cls += ' ' + this.inputType + '-inline';
+ cfg.cls += ' ' + this.inputType + '-inline form-check-inline';
}
var input = {
tag: 'input',
type : 'hidden',
cls : 'roo-hidden-value',
- value : this.checked ? this.valueOff : this.inputValue
+ value : this.checked ? this.inputValue : this.valueOff
};
}
if(this.checked){
input.checked = this.checked;
-
}
-
if (this.name) {
input.name = this.name;
}
}
+ var boxLabelCfg = false;
+
+ if(this.boxLabel){
+
+ boxLabelCfg = {
+ tag: 'label',
+ //'for': id, // box label is handled by onclick - so no for...
+ cls: 'box-label',
+ html: this.boxLabel
+ };
+ if(this.tooltip){
+ boxLabelCfg.tooltip = this.tooltip;
+ }
+
+ }
+
if (align ==='left' && this.fieldLabel.length) {
// Roo.log("left and has label");
'for' : id,
cls : 'control-label',
html : this.fieldLabel
-
},
{
cls : "",
}
];
+ if (boxLabelCfg) {
+ cfg.cn[1].cn.push(boxLabelCfg);
+ }
+
if(this.labelWidth > 12){
cfg.cn[0].style = "width: " + this.labelWidth + 'px';
}
cls: 'control-label box-input-label',
//cls : 'input-group-addon',
html : this.fieldLabel
-
},
inputblock
];
+ if (boxLabelCfg) {
+ cfg.cn.push(boxLabelCfg);
+ }
} else {
// Roo.log(" no label && no align");
cfg.cn = [ inputblock ] ;
-
+ if (boxLabelCfg) {
+ cfg.cn.push(boxLabelCfg);
+ }
+
}
- if(this.boxLabel){
- var boxLabelCfg = {
- tag: 'label',
- //'for': id, // box label is handled by onclick - so no for...
- cls: 'box-label',
- html: this.boxLabel
- };
-
- if(this.tooltip){
- boxLabelCfg.tooltip = this.tooltip;
- }
-
- cfg.cn.push(boxLabelCfg);
- }
+
if(this.inputType != 'radio'){
cfg.cn.push(hidden);
}
},
- onClick : function()
+ onClick : function(e)
{
- this.setChecked(!this.checked);
+ if(this.fireEvent('click', this, e) !== false){
+ this.setChecked(!this.checked);
+ }
+
},
setChecked : function(state,suppressEvent)
validate : function()
{
+ if(this.getVisibilityEl().hasClass('hidden')){
+ return true;
+ }
+
if(
this.disabled ||
(this.inputType == 'radio' && this.validateRadio()) ||
validateRadio : function()
{
+ if(this.getVisibilityEl().hasClass('hidden')){
+ return true;
+ }
+
if(this.allowBlank){
return true;
}
{
if(!this.groupId){
return (this.getValue() == this.inputValue || this.allowBlank) ? true : false;
+ //return (this.getValue() == this.inputValue) ? true : false;
}
var group = Roo.bootstrap.CheckBox.get(this.groupId);
var r = false;
+ for(var i in group){
+ if(group[i].el.isVisible(true)){
+ r = false;
+ break;
+ }
+
+ r = true;
+ }
+
for(var i in group){
if(r){
break;
if(this.inputType == 'radio'){
Roo.each(this.el.up('form').select('input[name='+this.name+']', true).elements, function(e){
- e.findParent('.form-group', false, true).removeClass([_this.invalidClass, _this.validClass]);
- e.findParent('.form-group', false, true).addClass(_this.validClass);
+ var fg = e.findParent('.form-group', false, true);
+ if (Roo.bootstrap.version == 3) {
+ fg.removeClass([_this.invalidClass, _this.validClass]);
+ fg.addClass(_this.validClass);
+ } else {
+ fg.removeClass(['is-valid', 'is-invalid']);
+ fg.addClass('is-valid');
+ }
});
return;
}
-
+
if(!this.groupId){
- this.el.findParent('.form-group', false, true).removeClass([this.invalidClass, this.validClass]);
- this.el.findParent('.form-group', false, true).addClass(this.validClass);
+ var fg = this.el.findParent('.form-group', false, true);
+ if (Roo.bootstrap.version == 3) {
+ fg.removeClass([this.invalidClass, this.validClass]);
+ fg.addClass(this.validClass);
+ } else {
+ fg.removeClass(['is-valid', 'is-invalid']);
+ fg.addClass('is-valid');
+ }
return;
}
var group = Roo.bootstrap.CheckBox.get(this.groupId);
- Roo.log('changing group'+this.name);
-
if(!group){
return;
}
for(var i in group){
- group[i].el.findParent('.form-group', false, true).removeClass([this.invalidClass, this.validClass]);
- group[i].el.findParent('.form-group', false, true).addClass(this.validClass);
+ var fg = group[i].el.findParent('.form-group', false, true);
+ if (Roo.bootstrap.version == 3) {
+ fg.removeClass([this.invalidClass, this.validClass]);
+ fg.addClass(this.validClass);
+ } else {
+ fg.removeClass(['is-valid', 'is-invalid']);
+ fg.addClass('is-valid');
+ }
}
},
}
if(this.inputType == 'radio'){
+
Roo.each(this.el.up('form').select('input[name='+this.name+']', true).elements, function(e){
- e.findParent('.form-group', false, true).removeClass([_this.invalidClass, _this.validClass]);
- e.findParent('.form-group', false, true).addClass(_this.invalidClass);
+ var fg = e.findParent('.form-group', false, true);
+ if (Roo.bootstrap.version == 3) {
+ fg.removeClass([_this.invalidClass, _this.validClass]);
+ fg.addClass(_this.invalidClass);
+ } else {
+ fg.removeClass(['is-invalid', 'is-valid']);
+ fg.addClass('is-invalid');
+ }
});
return;
}
if(!this.groupId){
- this.el.findParent('.form-group', false, true).removeClass([this.invalidClass, this.validClass]);
- this.el.findParent('.form-group', false, true).addClass(this.invalidClass);
+ var fg = this.el.findParent('.form-group', false, true);
+ if (Roo.bootstrap.version == 3) {
+ fg.removeClass([_this.invalidClass, _this.validClass]);
+ fg.addClass(_this.invalidClass);
+ } else {
+ fg.removeClass(['is-invalid', 'is-valid']);
+ fg.addClass('is-invalid');
+ }
return;
}
}
for(var i in group){
- group[i].el.findParent('.form-group', false, true).removeClass([this.invalidClass, this.validClass]);
- group[i].el.findParent('.form-group', false, true).addClass(this.invalidClass);
+ var fg = group[i].el.findParent('.form-group', false, true);
+ if (Roo.bootstrap.version == 3) {
+ fg.removeClass([_this.invalidClass, _this.validClass]);
+ fg.addClass(_this.invalidClass);
+ } else {
+ fg.removeClass(['is-invalid', 'is-valid']);
+ fg.addClass('is-invalid');
+ }
}
},
{
Roo.bootstrap.Input.prototype.clearInvalid.call(this);
+ // this.el.findParent('.form-group', false, true).removeClass([this.invalidClass, this.validClass]);
+
var label = Roo.bootstrap.FieldLabel.get(this.name + '-group');
- if (label) {
- label.iconEl.removeClass(label.validClass);
- label.iconEl.removeClass(label.invalidClass);
+ if (label && label.iconEl) {
+ label.iconEl.removeClass([ label.validClass, label.invalidClass ]);
+ label.iconEl.removeClass(['is-invalid', 'is-valid']);
}
},
this.disabled = false;
this.fireEvent("enable", this);
return this;
+ },
+
+ setBoxLabel : function(v)
+ {
+ this.boxLabel = v;
+
+ if(this.rendered){
+ this.el.select('label.box-label',true).first().dom.innerHTML = (v === null || v === undefined ? '' : v);
+ }
}
});