Upgrade to ExtJS 4.0.1 - Released 05/18/2011
[extjs.git] / docs / source / Boolean.html
1 <!DOCTYPE html>
2 <html>
3 <head>
4   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
5   <title>The source code</title>
6   <link href="../prettify/prettify.css" type="text/css" rel="stylesheet" />
7   <script type="text/javascript" src="../prettify/prettify.js"></script>
8   <style type="text/css">
9     .highlight { display: block; background-color: #ddd; }
10   </style>
11   <script type="text/javascript">
12     function highlight() {
13       document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
14     }
15   </script>
16 </head>
17 <body onload="prettyPrint(); highlight();">
18   <pre class="prettyprint lang-js"><span id='Ext-grid-column-Boolean'>/**
19 </span> * @class Ext.grid.column.Boolean
20  * @extends Ext.grid.column.Column
21  * &lt;p&gt;A Column definition class which renders boolean data fields.  See the {@link Ext.grid.column.Column#xtype xtype}
22  * config option of {@link Ext.grid.column.Column} for more details.&lt;/p&gt;
23  *
24  * {@img Ext.grid.column.Boolean/Ext.grid.column.Boolean.png Ext.grid.column.Boolean grid column}
25  *
26  * ## Code
27  *     Ext.create('Ext.data.Store', {
28  *        storeId:'sampleStore',
29  *        fields:[
30  *            {name: 'framework', type: 'string'},
31  *            {name: 'rocks', type: 'boolean'}
32  *        ],
33  *        data:{'items':[
34  *            {&quot;framework&quot;:&quot;Ext JS 4&quot;, &quot;rocks&quot;:true},
35  *            {&quot;framework&quot;:&quot;Sencha Touch&quot;, &quot;rocks&quot;:true},
36  *            {&quot;framework&quot;:&quot;Ext GWT&quot;, &quot;rocks&quot;:true},            
37  *            {&quot;framework&quot;:&quot;Other Guys&quot;, &quot;rocks&quot;:false}            
38  *        ]},
39  *        proxy: {
40  *            type: 'memory',
41  *            reader: {
42  *                type: 'json',
43  *                root: 'items'
44  *            }
45  *        }
46  *     });
47  *     
48  *     Ext.create('Ext.grid.Panel', {
49  *         title: 'Boolean Column Demo',
50  *         store: Ext.data.StoreManager.lookup('sampleStore'),
51  *         columns: [
52  *             {text: 'Framework',  dataIndex: 'framework', flex: 1},
53  *             {
54  *                 xtype: 'booleancolumn', 
55  *                 text: 'Rocks',
56  *                 trueText: 'Yes',
57  *                 falseText: 'No', 
58  *                 dataIndex: 'rocks'}
59  *         ],
60  *         height: 200,
61  *         width: 400,
62  *         renderTo: Ext.getBody()
63  *     });
64  * 
65  * @xtype booleancolumn
66  */
67 Ext.define('Ext.grid.column.Boolean', {
68     extend: 'Ext.grid.column.Column',
69     alias: ['widget.booleancolumn'],
70     alternateClassName: 'Ext.grid.BooleanColumn',
71
72 <span id='Ext-grid-column-Boolean-cfg-trueText'>    /**
73 </span>     * @cfg {String} trueText
74      * The string returned by the renderer when the column value is not falsey (defaults to &lt;tt&gt;'true'&lt;/tt&gt;).
75      */
76     trueText: 'true',
77
78 <span id='Ext-grid-column-Boolean-cfg-falseText'>    /**
79 </span>     * @cfg {String} falseText
80      * The string returned by the renderer when the column value is falsey (but not undefined) (defaults to
81      * &lt;tt&gt;'false'&lt;/tt&gt;).
82      */
83     falseText: 'false',
84
85 <span id='Ext-grid-column-Boolean-cfg-undefinedText'>    /**
86 </span>     * @cfg {String} undefinedText
87      * The string returned by the renderer when the column value is undefined (defaults to &lt;tt&gt;'&amp;#160;'&lt;/tt&gt;).
88      */
89     undefinedText: '&amp;#160;',
90
91     constructor: function(cfg){
92         this.callParent(arguments);
93         var trueText      = this.trueText,
94             falseText     = this.falseText,
95             undefinedText = this.undefinedText;
96
97         this.renderer = function(value){
98             if(value === undefined){
99                 return undefinedText;
100             }
101             if(!value || value === 'false'){
102                 return falseText;
103             }
104             return trueText;
105         };
106     }
107 });</pre>
108 </body>
109 </html>