+++ /dev/null
-/*\r
- * Ext JS Library 2.2.1\r
- * Copyright(c) 2006-2009, Ext JS, LLC.\r
- * licensing@extjs.com\r
- * \r
- * http://extjs.com/license\r
- */\r
-\r
-/**\r
- * @class Ext.form.Checkbox\r
- * @extends Ext.form.Field\r
- * Single checkbox field. Can be used as a direct replacement for traditional checkbox fields.\r
- * @constructor\r
- * Creates a new Checkbox\r
- * @param {Object} config Configuration options\r
- */\r
-Ext.form.Checkbox = Ext.extend(Ext.form.Field, {\r
- /**\r
- * @cfg {String} checkedCls The CSS class to use when the control is checked (defaults to 'x-form-check-checked').\r
- * Note that this class applies to both checkboxes and radio buttons and is added to the control's wrapper element.\r
- */\r
- checkedCls: 'x-form-check-checked',\r
- /**\r
- * @cfg {String} focusCls The CSS class to use when the control receives input focus (defaults to 'x-form-check-focus').\r
- * Note that this class applies to both checkboxes and radio buttons and is added to the control's wrapper element.\r
- */\r
- focusCls: 'x-form-check-focus',\r
- /**\r
- * @cfg {String} overCls The CSS class to use when the control is hovered over (defaults to 'x-form-check-over').\r
- * Note that this class applies to both checkboxes and radio buttons and is added to the control's wrapper element.\r
- */\r
- overCls: 'x-form-check-over',\r
- /**\r
- * @cfg {String} mouseDownCls The CSS class to use when the control is being actively clicked (defaults to 'x-form-check-down').\r
- * Note that this class applies to both checkboxes and radio buttons and is added to the control's wrapper element.\r
- */\r
- mouseDownCls: 'x-form-check-down',\r
- /**\r
- * @cfg {Number} tabIndex The tabIndex for this field. Note this only applies to fields that are rendered,\r
- * not those which are built via applyTo (defaults to 0, which allows the browser to manage the tab index).\r
- */\r
- tabIndex: 0,\r
- /**\r
- * @cfg {Boolean} checked True if the checkbox should render already checked (defaults to false)\r
- */\r
- checked: false,\r
- /**\r
- * @cfg {String/Object} autoCreate A DomHelper element spec, or true for a default element spec (defaults to\r
- * {tag: "input", type: "checkbox", autocomplete: "off"}).\r
- */\r
- defaultAutoCreate: {tag: 'input', type: 'checkbox', autocomplete: 'off'},\r
- /**\r
- * @cfg {String} boxLabel The text that appears beside the checkbox (defaults to '')\r
- */\r
- /**\r
- * @cfg {String} inputValue The value that should go into the generated input element's value attribute\r
- * (defaults to undefined, with no value attribute)\r
- */\r
- /**\r
- * @cfg {Function} handler A function called when the {@link #checked} value changes (can be used instead of \r
- * handling the check event). The handler is passed the following parameters:\r
- * <div class="mdetail-params"><ul>\r
- * <li><b>checkbox</b> : Ext.form.Checkbox<div class="sub-desc">The Checkbox being toggled.</div></li>\r
- * <li><b>checked</b> : Boolean<div class="sub-desc">The new checked state of the checkbox.</div></li>\r
- * </ul></div>\r
- */\r
- /**\r
- * @cfg {Object} scope An object to use as the scope ("this" reference) of the {@link #handler} function\r
- * (defaults to this Checkbox).\r
- */\r
-\r
-\r
- // private\r
- baseCls: 'x-form-check',\r
-\r
- // private\r
- initComponent : function(){\r
- Ext.form.Checkbox.superclass.initComponent.call(this);\r
- this.addEvents(\r
- /**\r
- * @event check\r
- * Fires when the checkbox is checked or unchecked.\r
- * @param {Ext.form.Checkbox} this This checkbox\r
- * @param {Boolean} checked The new checked value\r
- */\r
- 'check'\r
- );\r
- },\r
-\r
- // private\r
- initEvents : function(){\r
- Ext.form.Checkbox.superclass.initEvents.call(this);\r
- this.initCheckEvents();\r
- },\r
-\r
- // private\r
- initCheckEvents : function(){\r
- this.innerWrap.removeAllListeners();\r
- this.innerWrap.addClassOnOver(this.overCls);\r
- this.innerWrap.addClassOnClick(this.mouseDownCls);\r
- this.innerWrap.on('click', this.onClick, this);\r
- this.innerWrap.on('keyup', this.onKeyUp, this);\r
- },\r
-\r
- // private\r
- onRender : function(ct, position){\r
- Ext.form.Checkbox.superclass.onRender.call(this, ct, position);\r
- if(this.inputValue !== undefined){\r
- this.el.dom.value = this.inputValue;\r
- }\r
- this.el.addClass('x-hidden');\r
-\r
- this.innerWrap = this.el.wrap({\r
- tabIndex: this.tabIndex,\r
- cls: this.baseCls+'-wrap-inner'\r
- });\r
- this.wrap = this.innerWrap.wrap({cls: this.baseCls+'-wrap'});\r
-\r
- if(this.boxLabel){\r
- this.labelEl = this.innerWrap.createChild({\r
- tag: 'label',\r
- htmlFor: this.el.id,\r
- cls: 'x-form-cb-label',\r
- html: this.boxLabel\r
- });\r
- }\r
-\r
- this.imageEl = this.innerWrap.createChild({\r
- tag: 'img',\r
- src: Ext.BLANK_IMAGE_URL,\r
- cls: this.baseCls\r
- }, this.el);\r
-\r
- if(this.checked){\r
- this.setValue(true);\r
- }else{\r
- this.checked = this.el.dom.checked;\r
- }\r
- this.originalValue = this.checked;\r
- },\r
- \r
- // private\r
- afterRender : function(){\r
- Ext.form.Checkbox.superclass.afterRender.call(this);\r
- this.wrap[this.checked? 'addClass' : 'removeClass'](this.checkedCls);\r
- },\r
-\r
- // private\r
- onDestroy : function(){\r
- if(this.rendered){\r
- Ext.destroy(this.imageEl, this.labelEl, this.innerWrap, this.wrap);\r
- }\r
- Ext.form.Checkbox.superclass.onDestroy.call(this);\r
- },\r
-\r
- // private\r
- onFocus: function(e) {\r
- Ext.form.Checkbox.superclass.onFocus.call(this, e);\r
- this.el.addClass(this.focusCls);\r
- },\r
-\r
- // private\r
- onBlur: function(e) {\r
- Ext.form.Checkbox.superclass.onBlur.call(this, e);\r
- this.el.removeClass(this.focusCls);\r
- },\r
-\r
- // private\r
- onResize : function(){\r
- Ext.form.Checkbox.superclass.onResize.apply(this, arguments);\r
- if(!this.boxLabel && !this.fieldLabel){\r
- this.el.alignTo(this.wrap, 'c-c');\r
- }\r
- },\r
-\r
- // private\r
- onKeyUp : function(e){\r
- if(e.getKey() == Ext.EventObject.SPACE){\r
- this.onClick(e);\r
- }\r
- },\r
-\r
- // private\r
- onClick : function(e){\r
- if (!this.disabled && !this.readOnly) {\r
- this.toggleValue();\r
- }\r
- e.stopEvent();\r
- },\r
-\r
- // private\r
- onEnable : function(){\r
- Ext.form.Checkbox.superclass.onEnable.call(this);\r
- this.initCheckEvents();\r
- },\r
-\r
- // private\r
- onDisable : function(){\r
- Ext.form.Checkbox.superclass.onDisable.call(this);\r
- this.innerWrap.removeAllListeners();\r
- },\r
-\r
- toggleValue : function(){\r
- this.setValue(!this.checked);\r
- },\r
-\r
- // private\r
- getResizeEl : function(){\r
- if(!this.resizeEl){\r
- this.resizeEl = Ext.isSafari ? this.wrap : (this.wrap.up('.x-form-element', 5) || this.wrap);\r
- }\r
- return this.resizeEl;\r
- },\r
-\r
- // private\r
- getPositionEl : function(){\r
- return this.wrap;\r
- },\r
-\r
- // private\r
- getActionEl : function(){\r
- return this.wrap;\r
- },\r
-\r
- /**\r
- * Overridden and disabled. The editor element does not support standard valid/invalid marking. @hide\r
- * @method\r
- */\r
- markInvalid : Ext.emptyFn,\r
- /**\r
- * Overridden and disabled. The editor element does not support standard valid/invalid marking. @hide\r
- * @method\r
- */\r
- clearInvalid : Ext.emptyFn,\r
-\r
- // private\r
- initValue : Ext.emptyFn,\r
-\r
- /**\r
- * Returns the checked state of the checkbox.\r
- * @return {Boolean} True if checked, else false\r
- */\r
- getValue : function(){\r
- if(this.rendered){\r
- return this.el.dom.checked;\r
- }\r
- return this.checked;\r
- },\r
-\r
- /**\r
- * Sets the checked state of the checkbox.\r
- * @param {Boolean/String} checked True, 'true', '1', or 'on' to check the checkbox, any other value will uncheck it.\r
- */\r
- setValue : function(v) {\r
- var checked = this.checked;\r
- this.checked = (v === true || v === 'true' || v == '1' || String(v).toLowerCase() == 'on');\r
- \r
- if(this.rendered){\r
- this.el.dom.checked = this.checked;\r
- this.el.dom.defaultChecked = this.checked;\r
- this.wrap[this.checked? 'addClass' : 'removeClass'](this.checkedCls);\r
- }\r
-\r
- if(checked != this.checked){\r
- this.fireEvent("check", this, this.checked);\r
- if(this.handler){\r
- this.handler.call(this.scope || this, this, this.checked);\r
- }\r
- }\r
- }\r
-\r
- /**\r
- * @cfg {Mixed} value\r
- * @hide\r
- */\r
- /**\r
- * @cfg {String} disabledClass\r
- * @hide\r
- */\r
- /**\r
- * @cfg {String} focusClass\r
- * @hide\r
- */\r
-});\r
-Ext.reg('checkbox', Ext.form.Checkbox);\r
git.ithinksw.org / extjs.git / blobdiff