docs/source/HeaderContainer.html

   1 <!DOCTYPE html><html><head><title>Sencha Documentation Project</title><link rel="stylesheet" href="../reset.css" type="text/css"><link rel="stylesheet" href="../prettify.css" type="text/css"><link rel="stylesheet" href="../prettify_sa.css" type="text/css"><script type="text/javascript" src="../prettify.js"></script></head><body onload="prettyPrint()"><pre class="prettyprint"><pre><span id='Ext-grid.property.HeaderContainer-method-constructor'><span id='Ext-grid.property.HeaderContainer'>/**
   2 </span></span> * @class Ext.grid.property.HeaderContainer
   3  * @extends Ext.grid.header.Container
   4  * A custom HeaderContainer for the {@link Ext.grid.property.Grid}.  Generally it should not need to be used directly.
   5  * @constructor
   6  * @param {Ext.grid.property.Grid} grid The grid this store will be bound to
   7  * @param {Object} source The source data config object
   8  */
   9 Ext.define('Ext.grid.property.HeaderContainer', {
  10
  11     extend: 'Ext.grid.header.Container',
  12
  13     alternateClassName: 'Ext.grid.PropertyColumnModel',
  14
  15     // private - strings used for locale support
  16     nameText : 'Name',
  17     valueText : 'Value',
  18     dateFormat : 'm/j/Y',
  19     trueText: 'true',
  20     falseText: 'false',
  21
  22     // private
  23     nameColumnCls: Ext.baseCSSPrefix + 'grid-property-name',
  24
  25     constructor : function(grid, store) {
  26
  27         this.grid = grid;
  28         this.store = store;
  29         this.callParent([{
  30             items: [{
  31                 header: this.nameText,
  32                 width: 115,
  33                 sortable: true,
  34                 dataIndex: grid.nameField,
  35                 renderer: Ext.Function.bind(this.renderProp, this),
  36                 itemId: grid.nameField,
  37                 menuDisabled :true,
  38                 tdCls: this.nameColumnCls
  39             }, {
  40                 header: this.valueText,
  41                 renderer: Ext.Function.bind(this.renderCell, this),
  42                 getEditor: function(record) {
  43                     return grid.getCellEditor(record, this);
  44                 },
  45                 flex: 1,
  46                 fixed: true,
  47                 dataIndex: grid.valueField,
  48                 itemId: grid.valueField,
  49                 menuDisabled: true
  50             }]
  51         }]);
  52     },
  53
  54     // private
  55     // Render a property name cell
  56     renderProp : function(v) {
  57         return this.getPropertyName(v);
  58     },
  59
  60     // private
  61     // Render a property value cell
  62     renderCell : function(val, meta, rec) {
  63         var me = this,
  64             renderer = this.grid.customRenderers[rec.get(me.grid.nameField)],
  65             result = val;
  66
  67         if (renderer) {
  68             return renderer.apply(this, arguments);
  69         }
  70         if (Ext.isDate(val)) {
  71             result = this.renderDate(val);
  72         } else if (Ext.isBoolean(val)) {
  73             result = this.renderBool(val);
  74         }
  75         return Ext.util.Format.htmlEncode(result);
  76     },
  77
  78     // private
  79     renderDate : Ext.util.Format.date,
  80
  81     // private
  82     renderBool : function(bVal) {
  83         return this[bVal ? 'trueText' : 'falseText'];
  84     },
  85
  86     // private
  87     // Renders custom property names instead of raw names if defined in the Grid
  88     getPropertyName : function(name) {
  89         var pn = this.grid.propertyNames;
  90         return pn &amp;&amp; pn[name] ? pn[name] : name;
  91     }
  92 });</pre></pre></body></html>