docs/source/Column1.html

   1 <html>\r
   2 <head>\r
   3   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    \r
   4   <title>The source code</title>\r
   5     <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
   6     <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
   7 </head>\r
   8 <body  onload="prettyPrint();">\r
   9     <pre class="prettyprint lang-js"><div id="cls-Ext.list.Column"></div>/**
  10  * @class Ext.list.Column
  11  * <p>This class encapsulates column configuration data to be used in the initialization of a
  12  * {@link Ext.list.ListView ListView}.</p>
  13  * <p>While subclasses are provided to render data in different ways, this class renders a passed
  14  * data field unchanged and is usually used for textual columns.</p>
  15  */
  16 Ext.list.Column = Ext.extend(Object, {
  17     /**
  18      * @private
  19      * @cfg {Boolean} isColumn
  20      * Used by ListView constructor method to avoid reprocessing a Column
  21      * if <code>isColumn</code> is not set ListView will recreate a new Ext.list.Column
  22      * Defaults to true.
  23      */
  24     isColumn: true,
  25
  26     <div id="cfg-Ext.list.Column-align"></div>/**
  27      * @cfg {String} align
  28      * Set the CSS text-align property of the column. Defaults to <tt>'left'</tt>.
  29      */
  30     align: 'left',
  31     <div id="cfg-Ext.list.Column-header"></div>/**
  32      * @cfg {String} header Optional. The header text to be used as innerHTML
  33      * (html tags are accepted) to display in the ListView.  <b>Note</b>: to
  34      * have a clickable header with no text displayed use <tt>'&#160;'</tt>.
  35      */
  36     header: '',
  37
  38     <div id="cfg-Ext.list.Column-width"></div>/**
  39      * @cfg {Number} width Optional. Percentage of the container width
  40      * this column should be allocated.  Columns that have no width specified will be
  41      * allocated with an equal percentage to fill 100% of the container width.  To easily take
  42      * advantage of the full container width, leave the width of at least one column undefined.
  43      * Note that if you do not want to take up the full width of the container, the width of
  44      * every column needs to be explicitly defined.
  45      */
  46     width: null,
  47
  48     <div id="cfg-Ext.list.Column-cls"></div>/**
  49      * @cfg {String} cls Optional. This option can be used to add a CSS class to the cell of each
  50      * row for this column.
  51      */
  52     cls: '',
  53
  54     <div id="cfg-Ext.list.Column-tpl"></div>/**
  55      * @cfg {String} tpl Optional. Specify a string to pass as the
  56      * configuration string for {@link Ext.XTemplate}.  By default an {@link Ext.XTemplate}
  57      * will be implicitly created using the <tt>dataIndex</tt>.
  58      */
  59
  60     <div id="cfg-Ext.list.Column-dataIndex"></div>/**
  61      * @cfg {String} dataIndex <p><b>Required</b>. The name of the field in the
  62      * ListViews's {@link Ext.data.Store}'s {@link Ext.data.Record} definition from
  63      * which to draw the column's value.</p>
  64      */
  65
  66     constructor : function(c){
  67         if(!c.tpl){
  68             c.tpl = new Ext.XTemplate('{' + c.dataIndex + '}');
  69         }
  70         else if(Ext.isString(c.tpl)){
  71             c.tpl = new Ext.XTemplate(c.tpl);
  72         }
  73
  74         Ext.apply(this, c);
  75     }
  76 });
  77
  78 Ext.reg('lvcolumn', Ext.list.Column);
  79
  80 <div id="cls-Ext.list.NumberColumn"></div>/**
  81  * @class Ext.list.NumberColumn
  82  * @extends Ext.list.Column
  83  * <p>A Column definition class which renders a numeric data field according to a {@link #format} string.  See the
  84  * {@link Ext.list.Column#xtype xtype} config option of {@link Ext.list.Column} for more details.</p>
  85  */
  86 Ext.list.NumberColumn = Ext.extend(Ext.list.Column, {
  87     <div id="cfg-Ext.list.NumberColumn-format"></div>/**
  88      * @cfg {String} format
  89      * A formatting string as used by {@link Ext.util.Format#number} to format a numeric value for this Column
  90      * (defaults to <tt>'0,000.00'</tt>).
  91      */
  92     format: '0,000.00',
  93
  94     constructor : function(c) {
  95         c.tpl = c.tpl || new Ext.XTemplate('{' + c.dataIndex + ':number("' + (c.format || this.format) + '")}');
  96         Ext.list.NumberColumn.superclass.constructor.call(this, c);
  97     }
  98 });
  99
 100 Ext.reg('lvnumbercolumn', Ext.list.NumberColumn);
 101
 102 <div id="cls-Ext.list.DateColumn"></div>/**
 103  * @class Ext.list.DateColumn
 104  * @extends Ext.list.Column
 105  * <p>A Column definition class which renders a passed date according to the default locale, or a configured
 106  * {@link #format}. See the {@link Ext.list.Column#xtype xtype} config option of {@link Ext.list.Column}
 107  * for more details.</p>
 108  */
 109 Ext.list.DateColumn = Ext.extend(Ext.list.Column, {
 110     format: 'm/d/Y',
 111     constructor : function(c) {
 112         c.tpl = c.tpl || new Ext.XTemplate('{' + c.dataIndex + ':date("' + (c.format || this.format) + '")}');
 113         Ext.list.DateColumn.superclass.constructor.call(this, c);
 114     }
 115 });
 116 Ext.reg('lvdatecolumn', Ext.list.DateColumn);
 117
 118 <div id="cls-Ext.list.BooleanColumn"></div>/**
 119  * @class Ext.list.BooleanColumn
 120  * @extends Ext.list.Column
 121  * <p>A Column definition class which renders boolean data fields.  See the {@link Ext.list.Column#xtype xtype}
 122  * config option of {@link Ext.list.Column} for more details.</p>
 123  */
 124 Ext.list.BooleanColumn = Ext.extend(Ext.list.Column, {
 125     <div id="cfg-Ext.list.BooleanColumn-trueText"></div>/**
 126      * @cfg {String} trueText
 127      * The string returned by the renderer when the column value is not falsey (defaults to <tt>'true'</tt>).
 128      */
 129     trueText: 'true',
 130     <div id="cfg-Ext.list.BooleanColumn-falseText"></div>/**
 131      * @cfg {String} falseText
 132      * The string returned by the renderer when the column value is falsey (but not undefined) (defaults to
 133      * <tt>'false'</tt>).
 134      */
 135     falseText: 'false',
 136     <div id="cfg-Ext.list.BooleanColumn-undefinedText"></div>/**
 137      * @cfg {String} undefinedText
 138      * The string returned by the renderer when the column value is undefined (defaults to <tt>'&#160;'</tt>).
 139      */
 140     undefinedText: '&#160;',
 141
 142     constructor : function(c) {
 143         c.tpl = c.tpl || new Ext.XTemplate('{' + c.dataIndex + ':this.format}');
 144
 145         var t = this.trueText, f = this.falseText, u = this.undefinedText;
 146         c.tpl.format = function(v){
 147             if(v === undefined){
 148                 return u;
 149             }
 150             if(!v || v === 'false'){
 151                 return f;
 152             }
 153             return t;
 154         };
 155
 156         Ext.list.DateColumn.superclass.constructor.call(this, c);
 157     }
 158 });
 159
 160 Ext.reg('lvbooleancolumn', Ext.list.BooleanColumn);</pre>    \r
 161 </body>\r
 162 </html>