| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213 | <!DOCTYPE html><html><head>  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  <title>The source code</title>  <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />  <script type="text/javascript" src="../resources/prettify/prettify.js"></script>  <style type="text/css">    .highlight { display: block; background-color: #ddd; }  </style>  <script type="text/javascript">    function highlight() {      document.getElementById(location.hash.replace(/#/, "")).className = "highlight";    }  </script></head><body onload="prettyPrint(); highlight();">  <pre class="prettyprint lang-js"><span id='Ext-menu-CheckItem'>/**</span> * A menu item that contains a togglable checkbox by default, but that can also be a part of a radio group. * *     @example *     Ext.create('Ext.menu.Menu', { *         width: 100, *         height: 110, *         floating: false,  // usually you want this set to True (default) *         renderTo: Ext.getBody(),  // usually rendered by it's containing component *         items: [{ *             xtype: 'menucheckitem', *             text: 'select all' *         },{ *             xtype: 'menucheckitem', *             text: 'select specific' *         },{ *             iconCls: 'add16', *             text: 'icon item' *         },{ *             text: 'regular item' *         }] *     }); */Ext.define('Ext.menu.CheckItem', {    extend: 'Ext.menu.Item',    alias: 'widget.menucheckitem',    <span id='Ext-menu-CheckItem-cfg-checked'>    /**</span>     * @cfg {Boolean} [checked=false]     * True to render the menuitem initially checked.     */    <span id='Ext-menu-CheckItem-cfg-checkHandler'>    /**</span>     * @cfg {Function} checkHandler     * Alternative for the {@link #checkchange} event.  Gets called with the same parameters.     */<span id='Ext-menu-CheckItem-cfg-scope'>    /**</span>     * @cfg {Object} scope     * Scope for the {@link #checkHandler} callback.     */    <span id='Ext-menu-CheckItem-cfg-group'>    /**</span>     * @cfg {String} group     * Name of a radio group that the item belongs.     *     * Specifying this option will turn check item into a radio item.     *     * Note that the group name must be globally unique.     */<span id='Ext-menu-CheckItem-cfg-checkedCls'>    /**</span>     * @cfg {String} checkedCls     * The CSS class used by {@link #cls} to show the checked state.     * Defaults to `Ext.baseCSSPrefix + 'menu-item-checked'`.     */    checkedCls: Ext.baseCSSPrefix + 'menu-item-checked',<span id='Ext-menu-CheckItem-cfg-uncheckedCls'>    /**</span>     * @cfg {String} uncheckedCls     * The CSS class used by {@link #cls} to show the unchecked state.     * Defaults to `Ext.baseCSSPrefix + 'menu-item-unchecked'`.     */    uncheckedCls: Ext.baseCSSPrefix + 'menu-item-unchecked',<span id='Ext-menu-CheckItem-cfg-groupCls'>    /**</span>     * @cfg {String} groupCls     * The CSS class applied to this item's icon image to denote being a part of a radio group.     * Defaults to `Ext.baseCSSClass + 'menu-group-icon'`.     * Any specified {@link #iconCls} overrides this.     */    groupCls: Ext.baseCSSPrefix + 'menu-group-icon',<span id='Ext-menu-CheckItem-cfg-hideOnClick'>    /**</span>     * @cfg {Boolean} [hideOnClick=false]     * Whether to not to hide the owning menu when this item is clicked.     * Defaults to `false` for checkbox items, and to `true` for radio group items.     */    hideOnClick: false,    <span id='Ext-menu-CheckItem-cfg-checkChangeDisabled'>    /**</span>     * @cfg {Boolean} [checkChangeDisabled=false]     * True to prevent the checked item from being toggled. Any submenu will still be accessible.     */    checkChangeDisabled: false,    afterRender: function() {        var me = this;        me.callParent();        me.checked = !me.checked;        me.setChecked(!me.checked, true);        if (me.checkChangeDisabled) {            me.disableCheckChange();        }    },    initComponent: function() {        var me = this;        me.addEvents(<span id='Ext-menu-CheckItem-event-beforecheckchange'>            /**</span>             * @event beforecheckchange             * Fires before a change event. Return false to cancel.             * @param {Ext.menu.CheckItem} this             * @param {Boolean} checked             */            'beforecheckchange',<span id='Ext-menu-CheckItem-event-checkchange'>            /**</span>             * @event checkchange             * Fires after a change event.             * @param {Ext.menu.CheckItem} this             * @param {Boolean} checked             */            'checkchange'        );        me.callParent(arguments);        Ext.menu.Manager.registerCheckable(me);        if (me.group) {            if (!me.iconCls) {                me.iconCls = me.groupCls;            }            if (me.initialConfig.hideOnClick !== false) {                me.hideOnClick = true;            }        }    },<span id='Ext-menu-CheckItem-method-disableCheckChange'>    /**</span>     * Disables just the checkbox functionality of this menu Item. If this menu item has a submenu, that submenu     * will still be accessible     */    disableCheckChange: function() {        var me = this,            iconEl = me.iconEl;        if (iconEl) {            iconEl.addCls(me.disabledCls);        }        // In some cases the checkbox will disappear until repainted        // Happens in everything except IE9 strict, see: EXTJSIV-6412        if (!(Ext.isIE9 && Ext.isStrict) && me.rendered) {            me.el.repaint();        }        me.checkChangeDisabled = true;    },<span id='Ext-menu-CheckItem-method-enableCheckChange'>    /**</span>     * Reenables the checkbox functionality of this menu item after having been disabled by {@link #disableCheckChange}     */    enableCheckChange: function() {        var me = this,            iconEl = me.iconEl;                    if (iconEl) {            iconEl.removeCls(me.disabledCls);        }        me.checkChangeDisabled = false;    },    onClick: function(e) {        var me = this;        if(!me.disabled && !me.checkChangeDisabled && !(me.checked && me.group)) {            me.setChecked(!me.checked);        }        this.callParent([e]);    },    onDestroy: function() {        Ext.menu.Manager.unregisterCheckable(this);        this.callParent(arguments);    },<span id='Ext-menu-CheckItem-method-setChecked'>    /**</span>     * Sets the checked state of the item     * @param {Boolean} checked True to check, false to uncheck     * @param {Boolean} [suppressEvents=false] True to prevent firing the checkchange events.     */    setChecked: function(checked, suppressEvents) {        var me = this;        if (me.checked !== checked && (suppressEvents || me.fireEvent('beforecheckchange', me, checked) !== false)) {            if (me.el) {                me.el[checked  ? 'addCls' : 'removeCls'](me.checkedCls)[!checked ? 'addCls' : 'removeCls'](me.uncheckedCls);            }            me.checked = checked;            Ext.menu.Manager.onCheckChange(me, checked);            if (!suppressEvents) {                Ext.callback(me.checkHandler, me.scope, [me, checked]);                me.fireEvent('checkchange', me, checked);            }        }    }});</pre></body></html>
 |