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