src/widgets/menu/CheckItem.js

   1 /*!
   2  * Ext JS Library 3.2.1
   3  * Copyright(c) 2006-2010 Ext JS, Inc.
   4  * licensing@extjs.com
   5  * http://www.extjs.com/license
   6  */
   7 /**
   8  * @class Ext.menu.CheckItem
   9  * @extends Ext.menu.Item
  10  * Adds a menu item that contains a checkbox by default, but can also be part of a radio group.
  11  * @constructor
  12  * Creates a new CheckItem
  13  * @param {Object} config Configuration options
  14  * @xtype menucheckitem
  15  */
  16 Ext.menu.CheckItem = Ext.extend(Ext.menu.Item, {
  17     /**
  18      * @cfg {String} group
  19      * All check items with the same group name will automatically be grouped into a single-select
  20      * radio button group (defaults to '')
  21      */
  22     /**
  23      * @cfg {String} itemCls The default CSS class to use for check items (defaults to "x-menu-item x-menu-check-item")
  24      */
  25     itemCls : "x-menu-item x-menu-check-item",
  26     /**
  27      * @cfg {String} groupClass The default CSS class to use for radio group check items (defaults to "x-menu-group-item")
  28      */
  29     groupClass : "x-menu-group-item",
  30
  31     /**
  32      * @cfg {Boolean} checked True to initialize this checkbox as checked (defaults to false).  Note that
  33      * if this checkbox is part of a radio group (group = true) only the last item in the group that is
  34      * initialized with checked = true will be rendered as checked.
  35      */
  36     checked: false,
  37
  38     // private
  39     ctype: "Ext.menu.CheckItem",
  40
  41     initComponent : function(){
  42         Ext.menu.CheckItem.superclass.initComponent.call(this);
  43             this.addEvents(
  44                 /**
  45                  * @event beforecheckchange
  46                  * Fires before the checked value is set, providing an opportunity to cancel if needed
  47                  * @param {Ext.menu.CheckItem} this
  48                  * @param {Boolean} checked The new checked value that will be set
  49                  */
  50                 "beforecheckchange" ,
  51                 /**
  52                  * @event checkchange
  53                  * Fires after the checked value has been set
  54                  * @param {Ext.menu.CheckItem} this
  55                  * @param {Boolean} checked The checked value that was set
  56                  */
  57                 "checkchange"
  58             );
  59             /**
  60              * A function that handles the checkchange event.  The function is undefined by default, but if an implementation
  61              * is provided, it will be called automatically when the checkchange event fires.
  62              * @param {Ext.menu.CheckItem} this
  63              * @param {Boolean} checked The checked value that was set
  64              * @method checkHandler
  65              */
  66             if(this.checkHandler){
  67                 this.on('checkchange', this.checkHandler, this.scope);
  68             }
  69             Ext.menu.MenuMgr.registerCheckable(this);
  70     },
  71
  72     // private
  73     onRender : function(c){
  74         Ext.menu.CheckItem.superclass.onRender.apply(this, arguments);
  75         if(this.group){
  76             this.el.addClass(this.groupClass);
  77         }
  78         if(this.checked){
  79             this.checked = false;
  80             this.setChecked(true, true);
  81         }
  82     },
  83
  84     // private
  85     destroy : function(){
  86         Ext.menu.MenuMgr.unregisterCheckable(this);
  87         Ext.menu.CheckItem.superclass.destroy.apply(this, arguments);
  88     },
  89
  90     /**
  91      * Set the checked state of this item
  92      * @param {Boolean} checked The new checked value
  93      * @param {Boolean} suppressEvent (optional) True to prevent the checkchange event from firing (defaults to false)
  94      */
  95     setChecked : function(state, suppressEvent){
  96         var suppress = suppressEvent === true;
  97         if(this.checked != state && (suppress || this.fireEvent("beforecheckchange", this, state) !== false)){
  98             if(this.container){
  99                 this.container[state ? "addClass" : "removeClass"]("x-menu-item-checked");
 100             }
 101             this.checked = state;
 102             if(!suppress){
 103                 this.fireEvent("checkchange", this, state);
 104             }
 105         }
 106     },
 107
 108     // private
 109     handleClick : function(e){
 110        if(!this.disabled && !(this.checked && this.group)){// disable unselect on radio item
 111            this.setChecked(!this.checked);
 112        }
 113        Ext.menu.CheckItem.superclass.handleClick.apply(this, arguments);
 114     }
 115 });
 116 Ext.reg('menucheckitem', Ext.menu.CheckItem);