123 lines
No EOL
3.6 KiB
JavaScript
123 lines
No EOL
3.6 KiB
JavaScript
/*
|
|
* Ext JS Library 1.0.1
|
|
* Copyright(c) 2006-2007, Ext JS, LLC.
|
|
* licensing@extjs.com
|
|
*
|
|
* http://www.extjs.com/license
|
|
*/
|
|
|
|
/**
|
|
* @class Ext.form.Checkbox
|
|
* @extends Ext.form.Field
|
|
* Single checkbox field. Can be used as a direct replacement for traditional checkbox fields.
|
|
* @constructor
|
|
* Creates a new CheckBox
|
|
* @param {Object} config Configuration options
|
|
*/
|
|
Ext.form.Checkbox = function(config){
|
|
Ext.form.Checkbox.superclass.constructor.call(this, config);
|
|
this.addEvents({
|
|
/**
|
|
* @event check
|
|
* Fires when the checkbox is checked or unchecked
|
|
* @param {Ext.form.Checkbox} this This checkbox
|
|
* @param {Boolean} checked The new checked value
|
|
*/
|
|
check : true
|
|
});
|
|
};
|
|
|
|
Ext.extend(Ext.form.Checkbox, Ext.form.Field, {
|
|
/**
|
|
* @cfg {String} focusClass The CSS class to use when the checkbox receives focus (defaults to 'x-form-check-focus')
|
|
*/
|
|
focusClass : "x-form-check-focus",
|
|
/**
|
|
* @cfg {String} fieldClass The default CSS class for the checkbox (defaults to "x-form-field")
|
|
*/
|
|
fieldClass: "x-form-field",
|
|
/**
|
|
* @cfg {Boolean} checked True if the the checkbox should render already checked (defaults to false)
|
|
*/
|
|
checked: false,
|
|
|
|
// private
|
|
defaultAutoCreate : { tag: "input", type: 'checkbox', autocomplete: "off"},
|
|
/**
|
|
* @cfg {String} boxLabel The text that appears beside the checkbox
|
|
*/
|
|
boxLabel : undefined,
|
|
/**
|
|
* @cfg {String} inputValue The value that should go into the generated input element's value attribute
|
|
*/
|
|
/**
|
|
* Sets the width and height of the checkbox wrapper element
|
|
* @param {Number} width New width in pixels
|
|
* @param {Number} height New height in pixels
|
|
*/
|
|
setSize : function(w, h){
|
|
if(!this.wrap){
|
|
this.width = w;
|
|
this.height = h;
|
|
return;
|
|
}
|
|
this.wrap.setSize(w, h);
|
|
if(!this.boxLabel){
|
|
this.el.alignTo(this.wrap, 'c-c');
|
|
}
|
|
},
|
|
|
|
initEvents : function(){
|
|
Ext.form.Checkbox.superclass.initEvents.call(this);
|
|
this.el.on("click", this.onClick, this);
|
|
this.el.on("change", this.onClick, this);
|
|
},
|
|
|
|
|
|
// private
|
|
onRender : function(ct, position){
|
|
Ext.form.Checkbox.superclass.onRender.call(this, ct, position);
|
|
if(this.inputValue !== undefined){
|
|
this.el.dom.value = this.inputValue;
|
|
}
|
|
this.wrap = this.el.wrap({cls: "x-form-check-wrap"});
|
|
if(this.boxLabel){
|
|
this.wrap.createChild({tag: 'label', htmlFor: this.el.id, cls: 'x-form-cb-label', html: this.boxLabel});
|
|
}
|
|
if(this.checked){
|
|
this.setValue(true);
|
|
}
|
|
},
|
|
|
|
// private
|
|
initValue : Ext.emptyFn,
|
|
|
|
/**
|
|
* Returns the checked state of the checkbox.
|
|
* @return {Boolean} True if checked, else false
|
|
*/
|
|
getValue : function(){
|
|
if(this.rendered){
|
|
return this.el.dom.checked;
|
|
}
|
|
return false;
|
|
},
|
|
|
|
onClick : function(){
|
|
if(this.el.dom.checked != this.checked){
|
|
this.setValue(this.el.dom.checked);
|
|
}
|
|
},
|
|
|
|
/**
|
|
* Sets the checked state of the checkbox
|
|
* @param {Boolean/String} checked True, 'true,' or '1' to check the checkbox, any other value will uncheck it
|
|
*/
|
|
setValue : function(v){
|
|
this.checked = (v === true || v === 'true' || v == '1');
|
|
if(this.el && this.el.dom){
|
|
this.el.dom.checked = this.checked;
|
|
}
|
|
this.fireEvent("check", this, this.checked);
|
|
}
|
|
}); |