Upgrade to ExtJS 4.0.7 - Released 10/19/2011
[extjs.git] / docs / source / HeaderContainer.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="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
7   <script type="text/javascript" src="../resources/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-property-HeaderContainer'>/**
19 </span> * @class Ext.grid.property.HeaderContainer
20  * @extends Ext.grid.header.Container
21  * A custom HeaderContainer for the {@link Ext.grid.property.Grid}.  Generally it should not need to be used directly.
22  */
23 Ext.define('Ext.grid.property.HeaderContainer', {
24
25     extend: 'Ext.grid.header.Container',
26
27     alternateClassName: 'Ext.grid.PropertyColumnModel',
28     
29     nameWidth: 115,
30
31     // private - strings used for locale support
32     nameText : 'Name',
33     valueText : 'Value',
34     dateFormat : 'm/j/Y',
35     trueText: 'true',
36     falseText: 'false',
37
38     // private
39     nameColumnCls: Ext.baseCSSPrefix + 'grid-property-name',
40
41 <span id='Ext-grid-property-HeaderContainer-method-constructor'>    /**
42 </span>     * Creates new HeaderContainer.
43      * @param {Ext.grid.property.Grid} grid The grid this store will be bound to
44      * @param {Object} source The source data config object
45      */
46     constructor : function(grid, store) {
47         var me = this;
48         
49         me.grid = grid;
50         me.store = store;
51         me.callParent([{
52             items: [{
53                 header: me.nameText,
54                 width: grid.nameColumnWidth || me.nameWidth,
55                 sortable: true,
56                 dataIndex: grid.nameField,
57                 renderer: Ext.Function.bind(me.renderProp, me),
58                 itemId: grid.nameField,
59                 menuDisabled :true,
60                 tdCls: me.nameColumnCls
61             }, {
62                 header: me.valueText,
63                 renderer: Ext.Function.bind(me.renderCell, me),
64                 getEditor: Ext.Function.bind(me.getCellEditor, me),
65                 flex: 1,
66                 fixed: true,
67                 dataIndex: grid.valueField,
68                 itemId: grid.valueField,
69                 menuDisabled: true
70             }]
71         }]);
72     },
73     
74     getCellEditor: function(record){
75         return this.grid.getCellEditor(record, this);
76     },
77
78     // private
79     // Render a property name cell
80     renderProp : function(v) {
81         return this.getPropertyName(v);
82     },
83
84     // private
85     // Render a property value cell
86     renderCell : function(val, meta, rec) {
87         var me = this,
88             renderer = me.grid.customRenderers[rec.get(me.grid.nameField)],
89             result = val;
90
91         if (renderer) {
92             return renderer.apply(me, arguments);
93         }
94         if (Ext.isDate(val)) {
95             result = me.renderDate(val);
96         } else if (Ext.isBoolean(val)) {
97             result = me.renderBool(val);
98         }
99         return Ext.util.Format.htmlEncode(result);
100     },
101
102     // private
103     renderDate : Ext.util.Format.date,
104
105     // private
106     renderBool : function(bVal) {
107         return this[bVal ? 'trueText' : 'falseText'];
108     },
109
110     // private
111     // Renders custom property names instead of raw names if defined in the Grid
112     getPropertyName : function(name) {
113         var pn = this.grid.propertyNames;
114         return pn &amp;&amp; pn[name] ? pn[name] : name;
115     }
116 });</pre>
117 </body>
118 </html>