Upgrade to ExtJS 3.3.1 - Released 11/30/2010
[extjs.git] / docs / source / EditorGrid.html
index 2622eec..844cfff 100644 (file)
@@ -1,12 +1,18 @@
-<html>\r
-<head>\r
-  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    \r
-  <title>The source code</title>\r
-    <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
-    <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
-</head>\r
-<body  onload="prettyPrint();">\r
-    <pre class="prettyprint lang-js"><div id="cls-Ext.grid.EditorGridPanel"></div>/**
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    
+  <title>The source code</title>
+    <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
+    <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
+</head>
+<body  onload="prettyPrint();">
+    <pre class="prettyprint lang-js">/*!
+ * Ext JS Library 3.3.1
+ * Copyright(c) 2006-2010 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+<div id="cls-Ext.grid.EditorGridPanel"></div>/**
  * @class Ext.grid.EditorGridPanel
  * @extends Ext.grid.GridPanel
  * <p>This class extends the {@link Ext.grid.GridPanel GridPanel Class} to provide cell editing
@@ -37,7 +43,7 @@ Ext.grid.EditorGridPanel = Ext.extend(Ext.grid.GridPanel, {
      * editing that cell.</p>
      */
     clicksToEdit: 2,
-    
+
     <div id="cfg-Ext.grid.EditorGridPanel-forceValidation"></div>/**
     * @cfg {Boolean} forceValidation
     * True to force validation even if the value is unmodified (defaults to false)
@@ -49,15 +55,15 @@ Ext.grid.EditorGridPanel = Ext.extend(Ext.grid.GridPanel, {
     // private
     detectEdit: false,
 
-       <div id="cfg-Ext.grid.EditorGridPanel-autoEncode"></div>/**
-        * @cfg {Boolean} autoEncode
-        * True to automatically HTML encode and decode values pre and post edit (defaults to false)
-        */
-       autoEncode : false,
+    <div id="cfg-Ext.grid.EditorGridPanel-autoEncode"></div>/**
+     * @cfg {Boolean} autoEncode
+     * True to automatically HTML encode and decode values pre and post edit (defaults to false)
+     */
+    autoEncode : false,
 
-       <div id="cfg-Ext.grid.EditorGridPanel-trackMouseOver"></div>/**
-        * @cfg {Boolean} trackMouseOver @hide
-        */
+    <div id="cfg-Ext.grid.EditorGridPanel-trackMouseOver"></div>/**
+     * @cfg {Boolean} trackMouseOver @hide
+     */
     // private
     trackMouseOver: false, // causes very odd FF errors
 
@@ -75,7 +81,7 @@ Ext.grid.EditorGridPanel = Ext.extend(Ext.grid.GridPanel, {
 
         this.activeEditor = null;
 
-           this.addEvents(
+        this.addEvents(
             <div id="event-Ext.grid.EditorGridPanel-beforeedit"></div>/**
              * @event beforeedit
              * Fires before cell editing is triggered. The edit event object has the following properties <br />
@@ -104,13 +110,13 @@ Ext.grid.EditorGridPanel = Ext.extend(Ext.grid.GridPanel, {
              * <li>column - The grid column index</li>
              * </ul>
              *
-             * <pre><code> 
+             * <pre><code>
 grid.on('afteredit', afterEdit, this );
 
 function afterEdit(e) {
     // execute an XHR to send/commit data to the server, in callback do (if successful):
     e.record.commit();
-}; 
+};
              * </code></pre>
              * @param {Object} e An edit event (see above for description)
              */
@@ -133,10 +139,10 @@ function afterEdit(e) {
              * records (not all).  By observing the grid's validateedit event, it can be cancelled if
              * the edit occurs on a targeted row (for example) and then setting the field's new value
              * in the Record directly:
-             * <pre><code> 
+             * <pre><code>
 grid.on('validateedit', function(e) {
   var myTargetRow = 6;
+
   if (e.row == myTargetRow) {
     e.cancel = true;
     e.record.data[e.field] = e.value;
@@ -166,7 +172,7 @@ grid.on('validateedit', function(e) {
             this.on('celldblclick', this.onCellDblClick, this);
         }
     },
-    
+
     onResize : function(){
         Ext.grid.EditorGridPanel.superclass.onResize.apply(this, arguments);
         var ae = this.activeEditor;
@@ -205,9 +211,10 @@ grid.on('validateedit', function(e) {
     // private
     onEditComplete : function(ed, value, startValue){
         this.editing = false;
+        this.lastActiveEditor = this.activeEditor;
         this.activeEditor = null;
-        
-               var r = ed.record,
+
+        var r = ed.record,
             field = this.colModel.getDataIndex(ed.col);
         value = this.postEditValue(value, startValue, r, field);
         if(this.forceValidation === true || String(value) !== String(startValue)){
@@ -284,8 +291,16 @@ grid.on('validateedit', function(e) {
                     col: col
                 };
                 this.activeEditor = ed;
+                // Set the selectSameEditor flag if we are reusing the same editor again and
+                // need to prevent the editor from firing onBlur on itself.
+                ed.selectSameEditor = (this.activeEditor == this.lastActiveEditor);
                 var v = this.preEditValue(r, field);
                 ed.startEdit(this.view.getCell(row, col).firstChild, Ext.isDefined(v) ? v : '');
+
+                // Clear the selectSameEditor flag
+                (function(){
+                    delete ed.selectSameEditor;
+                }).defer(50);
             }
         }
     },
@@ -297,9 +312,9 @@ grid.on('validateedit', function(e) {
     },
 
     // private
-       postEditValue : function(value, originalValue, r, field){
-               return this.autoEncode && Ext.isString(value) ? Ext.util.Format.htmlEncode(value) : value;
-       },
+    postEditValue : function(value, originalValue, r, field){
+        return this.autoEncode && Ext.isString(value) ? Ext.util.Format.htmlEncode(value) : value;
+    },
 
     <div id="method-Ext.grid.EditorGridPanel-stopEditing"></div>/**
      * Stops any active editing
@@ -307,7 +322,8 @@ grid.on('validateedit', function(e) {
      */
     stopEditing : function(cancel){
         if(this.editing){
-            var ae = this.activeEditor;
+            // Store the lastActiveEditor to check if it is changing
+            var ae = this.lastActiveEditor = this.activeEditor;
             if(ae){
                 ae[cancel === true ? 'cancelEdit' : 'completeEdit']();
                 this.view.focusCell(ae.row, ae.col);
@@ -317,6 +333,6 @@ grid.on('validateedit', function(e) {
         this.editing = false;
     }
 });
-Ext.reg('editorgrid', Ext.grid.EditorGridPanel);</pre>    \r
-</body>\r
+Ext.reg('editorgrid', Ext.grid.EditorGridPanel);</pre>    
+</body>
 </html>
\ No newline at end of file