src/grid/column/Boolean.js

   1 /**
   2  * @class Ext.grid.column.Boolean
   3  * @extends Ext.grid.column.Column
   4  * <p>A Column definition class which renders boolean data fields.  See the {@link Ext.grid.column.Column#xtype xtype}
   5  * config option of {@link Ext.grid.column.Column} for more details.</p>
   6  *
   7  * {@img Ext.grid.column.Boolean/Ext.grid.column.Boolean.png Ext.grid.column.Boolean grid column}
   8  *
   9  *  ## Code
  10  *     Ext.create('Ext.data.Store', {
  11  *        storeId:'sampleStore',
  12  *        fields:[
  13  *            {name: 'framework', type: 'string'},
  14  *            {name: 'rocks', type: 'boolean'}
  15  *        ],
  16  *        data:{'items':[
  17  *            {"framework":"Ext JS 4", "rocks":true},
  18  *            {"framework":"Sencha Touch", "rocks":true},
  19  *            {"framework":"Ext GWT", "rocks":true},
  20  *            {"framework":"Other Guys", "rocks":false}
  21  *        ]},
  22  *        proxy: {
  23  *            type: 'memory',
  24  *            reader: {
  25  *                type: 'json',
  26  *                root: 'items'
  27  *            }
  28  *        }
  29  *    });
  30  *
  31  *    Ext.create('Ext.grid.Panel', {
  32  *        title: 'Boolean Column Demo',
  33  *        store: Ext.data.StoreManager.lookup('sampleStore'),
  34  *        columns: [
  35  *            {text: 'Framework',  dataIndex: 'framework', flex: 1},
  36  *            {
  37  *                xtype: 'booleancolumn',
  38  *                text: 'Rocks',
  39  *                trueText: 'Yes',
  40  *                falseText: 'No',
  41  *                dataIndex: 'rocks'}
  42  *        ],
  43  *        height: 200,
  44  *        width: 400,
  45  *        renderTo: Ext.getBody()
  46  *    });
  47  *
  48  * @xtype booleancolumn
  49  */
  50 Ext.define('Ext.grid.column.Boolean', {
  51     extend: 'Ext.grid.column.Column',
  52     alias: ['widget.booleancolumn'],
  53     alternateClassName: 'Ext.grid.BooleanColumn',
  54
  55     /**
  56      * @cfg {String} trueText
  57      * The string returned by the renderer when the column value is not falsey (defaults to <tt>'true'</tt>).
  58      */
  59     trueText: 'true',
  60
  61     /**
  62      * @cfg {String} falseText
  63      * The string returned by the renderer when the column value is falsey (but not undefined) (defaults to
  64      * <tt>'false'</tt>).
  65      */
  66     falseText: 'false',
  67
  68     /**
  69      * @cfg {String} undefinedText
  70      * The string returned by the renderer when the column value is undefined (defaults to <tt>'&#160;'</tt>).
  71      */
  72     undefinedText: '&#160;',
  73
  74     constructor: function(cfg){
  75         this.callParent(arguments);
  76         var trueText      = this.trueText,
  77             falseText     = this.falseText,
  78             undefinedText = this.undefinedText;
  79
  80         this.renderer = function(value){
  81             if(value === undefined){
  82                 return undefinedText;
  83             }
  84             if(!value || value === 'false'){
  85                 return falseText;
  86             }
  87             return trueText;
  88         };
  89     }
  90 });