Upgrade to ExtJS 4.0.7 - Released 10/19/2011
[extjs.git] / docs / source / Grid.html
index 68cbacf..e1a9f07 100644 (file)
@@ -3,8 +3,8 @@
 <head>
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   <title>The source code</title>
-  <link href="../prettify/prettify.css" type="text/css" rel="stylesheet" />
-  <script type="text/javascript" src="../prettify/prettify.js"></script>
+  <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
+  <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
   <style type="text/css">
     .highlight { display: block; background-color: #ddd; }
   </style>
   </script>
 </head>
 <body onload="prettyPrint(); highlight();">
-  <pre class="prettyprint lang-js"><span id='Ext-grid-property-Grid-method-constructor'><span id='Ext-grid-property-Grid'>/**
-</span></span> * @class Ext.grid.property.Grid
+  <pre class="prettyprint lang-js"><span id='Ext-grid-property-Grid'>/**
+</span> * @class Ext.grid.property.Grid
  * @extends Ext.grid.Panel
+ *
  * A specialized grid implementation intended to mimic the traditional property grid as typically seen in
  * development IDEs.  Each row in the grid represents a property of some object, and the data is stored
  * as a set of name/value pairs in {@link Ext.grid.property.Property Properties}.  Example usage:
- * &lt;pre&gt;&lt;code&gt;
-var grid = new Ext.grid.property.Grid({
-    title: 'Properties Grid',
-    width: 300,
-    renderTo: 'grid-ct',
-    source: {
-        &quot;(name)&quot;: &quot;My Object&quot;,
-        &quot;Created&quot;: Ext.Date.parse('10/15/2006', 'm/d/Y'),
-        &quot;Available&quot;: false,
-        &quot;Version&quot;: .01,
-        &quot;Description&quot;: &quot;A test object&quot;
-    }
-});
-&lt;/code&gt;&lt;/pre&gt;
- * @constructor
- * @param {Object} config The grid config object
- * @xtype propertygrid
+ *
+ *     @example
+ *     Ext.create('Ext.grid.property.Grid', {
+ *         title: 'Properties Grid',
+ *         width: 300,
+ *         renderTo: Ext.getBody(),
+ *         source: {
+ *             &quot;(name)&quot;: &quot;My Object&quot;,
+ *             &quot;Created&quot;: Ext.Date.parse('10/15/2006', 'm/d/Y'),
+ *             &quot;Available&quot;: false,
+ *             &quot;Version&quot;: .01,
+ *             &quot;Description&quot;: &quot;A test object&quot;
+ *         }
+ *     });
  */
 Ext.define('Ext.grid.property.Grid', {
 
     extend: 'Ext.grid.Panel',
-    
+
     alias: 'widget.propertygrid',
 
     alternateClassName: 'Ext.grid.PropertyGrid',
@@ -136,6 +134,11 @@ var grid = Ext.create('Ext.grid.property.Grid', {
      */
     nameField: 'name',
 
+<span id='Ext-grid-property-Grid-cfg-nameColumnWidth'>    /**
+</span>     * @cfg {Number} nameColumnWidth
+     * Optional. Specify the width for the name column. The value column will take any remaining space. Defaults to &lt;tt&gt;115&lt;/tt&gt;.
+     */
+
     // private config overrides
     enableColumnMove: false,
     columnLines: true,
@@ -158,7 +161,7 @@ var grid = Ext.create('Ext.grid.property.Grid', {
             // Inject a startEdit which always edits the value column
             startEdit: function(record, column) {
                 // Maintainer: Do not change this 'this' to 'me'! It is the CellEditing object's own scope.
-                Ext.grid.plugin.CellEditing.prototype.startEdit.call(this, record, me.headerCt.child('#' + me.valueField));
+                return this.self.prototype.startEdit.call(this, record, me.headerCt.child('#' + me.valueField));
             }
         }));
 
@@ -167,8 +170,8 @@ var grid = Ext.create('Ext.grid.property.Grid', {
             onCellSelect: function(position) {
                 if (position.column != 1) {
                     position.column = 1;
-                    Ext.selection.CellModel.prototype.onCellSelect.call(this, position);
                 }
+                return this.self.prototype.onCellSelect.call(this, position);
             }
         };
         me.customRenderers = me.customRenderers || {};
@@ -186,12 +189,12 @@ var grid = Ext.create('Ext.grid.property.Grid', {
 <span id='Ext-grid-property-Grid-event-beforepropertychange'>            /**
 </span>             * @event beforepropertychange
              * Fires before a property value changes.  Handlers can return false to cancel the property change
-             * (this will internally call {@link Ext.data.Record#reject} on the property's record).
+             * (this will internally call {@link Ext.data.Model#reject} on the property's record).
              * @param {Object} source The source data object for the grid (corresponds to the same object passed in
              * as the {@link #source} config property).
              * @param {String} recordId The record's id in the data store
-             * @param {Mixed} value The current edited property value
-             * @param {Mixed} oldValue The original property value prior to editing
+             * @param {Object} value The current edited property value
+             * @param {Object} oldValue The original property value prior to editing
              */
             'beforepropertychange',
 <span id='Ext-grid-property-Grid-event-propertychange'>            /**
@@ -200,8 +203,8 @@ var grid = Ext.create('Ext.grid.property.Grid', {
              * @param {Object} source The source data object for the grid (corresponds to the same object passed in
              * as the {@link #source} config property).
              * @param {String} recordId The record's id in the data store
-             * @param {Mixed} value The current edited property value
-             * @param {Mixed} oldValue The original property value prior to editing
+             * @param {Object} value The current edited property value
+             * @param {Object} oldValue The original property value prior to editing
              */
             'propertychange'
         );
@@ -222,7 +225,7 @@ var grid = Ext.create('Ext.grid.property.Grid', {
         };
 
         // Track changes to the data so we can fire our events.
-        this.store.on('update', me.onUpdate, me);
+        me.store.on('update', me.onUpdate, me);
     },
 
     // private
@@ -263,7 +266,7 @@ var grid = Ext.create('Ext.grid.property.Grid', {
     // returns the correct editor type for the property type, or a custom one keyed by the property name
     getCellEditor : function(record, column) {
         var me = this,
-            propName = record.get(me.nameField), 
+            propName = record.get(me.nameField),
             val = record.get(me.valueField),
             editor = me.customEditors[propName];
 
@@ -341,7 +344,7 @@ grid.setSource({
 <span id='Ext-grid-property-Grid-method-setProperty'>    /**
 </span>     * Sets the value of a property.
      * @param {String} prop The name of the property to set
-     * @param {Mixed} value The value to test
+     * @param {Object} value The value to test
      * @param {Boolean} create (Optional) True to create the property if it doesn't already exist. Defaults to &lt;tt&gt;false&lt;/tt&gt;.
      */
     setProperty: function(prop, value, create) {