docs/api/Ext.grid.plugin.CellEditing.html

   1 <!DOCTYPE html><html><head><title>Ext.grid.plugin.CellEditing | Ext JS 4.0 Documentation</title><script type="text/javascript" src="../ext-all.js"></script><link rel="stylesheet" href="../reset.css" type="text/css"><link rel="stylesheet" href="../scrollbars.css" type="text/css"><link rel="stylesheet" href="../docs.css" type="text/css"><link id="styleCss" rel="stylesheet" href="../style.css" type="text/css"><script type="text/javascript" src="../prettify.js"></script><link rel="stylesheet" href="../prettify.css" type="text/css"><!-- link(rel: 'stylesheet', href: req.baseURL + '/css/ext4.css', type: 'text/css')--><link rel="shortcut icon" type="image/ico" href="../favicon.ico"><!--[if IE]>
   2 <style type="text/css">.head-band { display: none; }
   3 .header { border: 0; top: 0; left: 0px; background: url(../header.gif) repeat-x; }
   4 .doc-tab .members .member a.more { background-color: #efefef; }
   5 </style><link rel="stylesheet" href="/new/css/ie.css" type="text/css"><![endif]-->
   6 </head><body id="ext-body" class="iScroll"><div id="notice" class="notice">For up to date documentation and features, visit
   7 <a href="http://docs.sencha.com/ext-js/4-0">http://docs.sencha.com/ext-js/4-0</a></div><div class="wrapper"><div class="head-band"></div><div class="header"><h2><a href="../index.html">Sencha Documentation</a></h2></div><div id="search"><form><input type="text" placeholder="Search" id="search-field" autocomplete="off" name="q"></form><div id="search-box"></div></div><div id="treePanel"></div><div id="container"><script type="text/javascript">
   8
   9     req = {
  10         liveURL: '.',
  11         standAloneMode: true,
  12         origDocClass: 'Ext.grid.plugin.CellEditing',
  13         docClass: 'Ext.grid.plugin.CellEditing',
  14         docReq: 'Ext.grid.plugin.CellEditing',
  15         version: '4.0',
  16         baseURL: '.',
  17         baseDocURL: '.',
  18         baseProdURL: '.'
  19     };
  20
  21     clsInfo = {};
  22
  23
  24
  25 </script>
  26
  27 <script type="text/javascript" src="../search.js"></script>
  28 <!--script type="text/javascript" src="/new/javascripts/app/examples.js"></script-->
  29 <script type="text/javascript" src="../class_tree.js"></script>
  30 <script type="text/javascript" src="../class_doc.js"></script>
  31 <script type="text/javascript">
  32     req.source = 'CellEditing.html#Ext-grid.plugin.CellEditing';
  33     clsInfo = {"methods":["addEvents","addListener","addManagedListener","cancelEdit","capture","clearListeners","clearManagedListeners","completeEdit","enableBubble","fireEvent","hasListener","observe","on","relayEvents","releaseCapture","removeListener","removeManagedListener","resumeEvents","startEdit","startEditByPosition","suspendEvents","un"],"cfgs":["clicksToEdit","listeners"],"properties":[],"events":["beforeedit","edit","validateedit"],"subclasses":[]};
  34     Ext.onReady(function() {
  35         Ext.create('Docs.classPanel');
  36     });
  37 </script><div id="top-block" class="top-block"><h1 id="clsTitle" class="cls"><a href="../source/CellEditing.html#Ext-grid.plugin.CellEditing" target="_blank">Ext.grid.plugin.CellEditing</a></h1></div><div id="docContent"><div id="doc-overview-content"><div class="lft"><pre class="subclasses"><h4>Hierarchy</h4><div class="subclass f"><a href="Ext.grid.plugin.Editing.html" rel="Ext.grid.plugin.Editing" class="cls docClass">Ext.grid.plugin.Editing</a><div class="subclass"><strong>Ext.grid.plugin.CellEditing</strong></div></div><h4>Mixins</h4><div class="mixin"><a href="Ext.util.Observable.html" rel="Ext.util.Observable" class="cls docClass">Ext.util.Observable</a></div></pre><p>The <a href="Ext.grid.plugin.CellEditing.html" rel="Ext.grid.plugin.CellEditing" class="docClass">Ext.grid.plugin.CellEditing</a> plugin injects editing at a cell level for a Grid. Only a single
  38 cell will be editable at a time. The field that will be used for the editor is defined at the
  39 <a href="Ext.grid.column.Column.html#field" rel="Ext.grid.column.Column#field" class="docClass">field</a>. The editor can be a field instance or a field configuration.</p>
  40
  41 <p>If an editor is not specified for a particular column then that cell will not be editable and it will
  42 be skipped when activated via the mouse or the keyboard.</p>
  43
  44 <p>The editor may be shared for each column in the grid, or a different one may be specified for each column.
  45 An appropriate field type should be chosen to match the data structure that it will be editing. For example,
  46 to edit a date, it would be useful to specify <a href="Ext.form.field.Date.html" rel="Ext.form.field.Date" class="docClass">Ext.form.field.Date</a> as the editor.</p>
  47
  48 <p><img class="screenshot" src="../Ext.grid.plugin.CellEditing.png" alt="Ext.grid.plugin.CellEditing plugin" /></p>
  49
  50 <h2>Example Usage</h2>
  51
  52 <pre class="prettyprint"><code>Ext.create('Ext.data.Store', {
  53     storeId:'simpsonsStore',
  54     fields:['name', 'email', 'phone'],
  55     data:{'items':[
  56         {"name":"Lisa", "email":"lisa@simpsons.com", "phone":"555-111-1224"},
  57         {"name":"Bart", "email":"bart@simpsons.com", "phone":"555--222-1234"},
  58         {"name":"Homer", "email":"home@simpsons.com", "phone":"555-222-1244"},
  59         {"name":"Marge", "email":"marge@simpsons.com", "phone":"555-222-1254"}
  60     ]},
  61     proxy: {
  62         type: 'memory',
  63         reader: {
  64             type: 'json',
  65             root: 'items'
  66         }
  67     }
  68 });
  69
  70 Ext.create('Ext.grid.Panel', {
  71     title: 'Simpsons',
  72     store: Ext.data.StoreManager.lookup('simpsonsStore'),
  73     columns: [
  74         {header: 'Name',  dataIndex: 'name', field: 'textfield'},
  75         {header: 'Email', dataIndex: 'email', flex:1,
  76             editor: {
  77                 xtype:'textfield',
  78                 allowBlank:false
  79             }
  80         },
  81         {header: 'Phone', dataIndex: 'phone'}
  82     ],
  83     selType: 'cellmodel',
  84     plugins: [
  85         Ext.create('Ext.grid.plugin.CellEditing', {
  86             clicksToEdit: 1
  87         })
  88     ],
  89     height: 200,
  90     width: 400,
  91     renderTo: Ext.getBody()
  92 });
  93 </code></pre>
  94 <div class="members"><div class="m-cfgs"><div class="definedBy">Defined By</div><a name="configs"></a><h3 class="cfg p">Config Options</h3><h4 class="cfgGroup">Other Configs</h4><div id="config-clicksToEdit" class="member f inherited"><a href="Ext.grid.plugin.CellEditing.html#config-clicksToEdit" rel="config-clicksToEdit" class="expand more"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.grid.plugin.Editing.html" class="definedIn docClass">Ext.grid.plugin.Editing</a><br/><a href="../source/Editing.html#Ext-grid.plugin.Editing-cfg-clicksToEdit" class="viewSource">view source</a></div><a name="clicksToEdit"></a><a name="config-clicksToEdit"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="config-clicksToEdit" class="cls expand">clicksToEdit</a><span> : Number</span></div><div class="description"><div class="short"><p>The number of clicks on a grid required to display the editor (defaults to 2).</p>
  95 </div><div class="long"><p>The number of clicks on a grid required to display the editor (defaults to 2).</p>
  96 </div></div></div><div id="config-listeners" class="member inherited"><a href="Ext.grid.plugin.CellEditing.html#config-listeners" rel="config-listeners" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-cfg-listeners" class="viewSource">view source</a></div><a name="listeners"></a><a name="config-listeners"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="config-listeners" class="cls expand">listeners</a><span> : Object</span></div><div class="description"><div class="short">(optional) A config object containing one or more event handlers to be added to this
  97 object during initialization.  T...</div><div class="long"><p>(optional) <p>A config object containing one or more event handlers to be added to this
  98 object during initialization.  This should be a valid listeners config object as specified in the
  99 <a href="Ext.grid.plugin.CellEditing.html#addListener" rel="Ext.grid.plugin.CellEditing#addListener" class="docClass">addListener</a> example for attaching multiple handlers at once.</p></p>
 100
 101 <br><p><b><u>DOM events from ExtJs <a href="Ext.Component.html" rel="Ext.Component" class="docClass">Components</a></u></b></p>
 102
 103
 104 <br><p>While <i>some</i> ExtJs Component classes export selected DOM events (e.g. "click", "mouseover" etc), this
 105
 106
 107 <p>is usually only done when extra value can be added. For example the <a href="Ext.view.View.html" rel="Ext.view.View" class="docClass">DataView</a>'s
 108 <b><code><a href="Ext.view.View.html#click" rel="Ext.view.View#click" class="docClass">click</a></code></b> event passing the node clicked on. To access DOM
 109 events directly from a child element of a Component, we need to specify the <code>element</code> option to
 110 identify the Component property to add a DOM listener to:</p>
 111
 112 <pre><code>new Ext.panel.Panel({
 113     width: 400,
 114     height: 200,
 115     dockedItems: [{
 116         xtype: 'toolbar'
 117     }],
 118     listeners: {
 119         click: {
 120             element: 'el', //bind to the underlying el property on the panel
 121             fn: function(){ console.log('click el'); }
 122         },
 123         dblclick: {
 124             element: 'body', //bind to the underlying body property on the panel
 125             fn: function(){ console.log('dblclick body'); }
 126         }
 127     }
 128 });
 129 </code></pre>
 130
 131
 132 <p></p></p>
 133 </div></div></div></div><div class="m-methods"><a name="methods"></a><div class="definedBy">Defined By</div><h3 class="mth p">Methods</h3><div id="method-addEvents" class="member f inherited"><a href="Ext.grid.plugin.CellEditing.html#method-addEvents" rel="method-addEvents" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-addEvents" class="viewSource">view source</a></div><a name="addEvents"></a><a name="method-addEvents"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="method-addEvents" class="cls expand">addEvents</a>(
 134 <span class="pre">Object/String o, String </span>)
 135  : void</div><div class="description"><div class="short"><p>Adds the specified events to the list of events which this Observable may fire.</p>
 136 </div><div class="long"><p>Adds the specified events to the list of events which this Observable may fire.</p>
 137 <h3 class="pa">Parameters</h3><ul><li><span class="pre">o</span> : Object/String<div class="sub-desc"><p>Either an object with event names as properties with a value of <code>true</code>
 138 or the first event name string if multiple event names are being passed as separate parameters.</p>
 139 </div></li><li><span class="pre"></span> : String<div class="sub-desc"><p>[additional] Optional additional event names if multiple event names are being passed as separate parameters.
 140 Usage:</p>
 141
 142 <pre><code>this.addEvents('storeloaded', 'storecleared');
 143 </code></pre>
 144
 145 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 146 </li></ul></div></div></div><div id="method-addListener" class="member inherited"><a href="Ext.grid.plugin.CellEditing.html#method-addListener" rel="method-addListener" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-addListener" class="viewSource">view source</a></div><a name="addListener"></a><a name="method-addListener"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="method-addListener" class="cls expand">addListener</a>(
 147 <span class="pre">String eventName, Function handler, [Object scope], [Object options]</span>)
 148  : void</div><div class="description"><div class="short"><p>Appends an event handler to this object.</p>
 149 </div><div class="long"><p>Appends an event handler to this object.</p>
 150 <h3 class="pa">Parameters</h3><ul><li><span class="pre">eventName</span> : String<div class="sub-desc"><p>The name of the event to listen for. May also be an object who's property names are event names. See</p>
 151 </div></li><li><span class="pre">handler</span> : Function<div class="sub-desc"><p>The method the event invokes.</p>
 152 </div></li><li><span class="pre">scope</span> : Object<div class="sub-desc"><p>(optional) The scope (<code><b>this</b></code> reference) in which the handler function is executed.
 153 <b>If omitted, defaults to the object which fired the event.</b></p>
 154 </div></li><li><span class="pre">options</span> : Object<div class="sub-desc"><p>(optional) An object containing handler configuration.
 155 properties. This may contain any of the following properties:<ul>
 156 <li><b>scope</b> : Object<div class="sub-desc">The scope (<code><b>this</b></code> reference) in which the handler function is executed.
 157 <b>If omitted, defaults to the object which fired the event.</b></div></li>
 158 <li><b>delay</b> : Number<div class="sub-desc">The number of milliseconds to delay the invocation of the handler after the event fires.</div></li>
 159 <li><b>single</b> : Boolean<div class="sub-desc">True to add a handler to handle just the next firing of the event, and then remove itself.</div></li>
 160 <li><b>buffer</b> : Number<div class="sub-desc">Causes the handler to be scheduled to run in an <a href="Ext.util.DelayedTask.html" rel="Ext.util.DelayedTask" class="docClass">Ext.util.DelayedTask</a> delayed
 161 by the specified number of milliseconds. If the event fires again within that time, the original
 162 handler is <em>not</em> invoked, but the new handler is scheduled in its place.</div></li>
 163 <li><b>target</b> : Observable<div class="sub-desc">Only call the handler if the event was fired on the target Observable, <i>not</i>
 164 if the event was bubbled up from a child Observable.</div></li>
 165 <li><b>element</b> : String<div class="sub-desc"><b>This option is only valid for listeners bound to <a href="Ext.Component.html" rel="Ext.Component" class="docClass">Components</a>.</b>
 166 The name of a Component property which references an element to add a listener to.</p>
 167
 168 <p>This option is useful during Component construction to add DOM event listeners to elements of <a href="Ext.Component.html" rel="Ext.Component" class="docClass">Components</a> which
 169 will exist only after the Component is rendered. For example, to add a click listener to a Panel's body:
 170 <pre><code>new Ext.panel.Panel({
 171     title: 'The title',
 172     listeners: {
 173         click: this.handlePanelClick,
 174         element: 'body'
 175     }
 176 });
 177 </code></pre></p>
 178
 179
 180 <p>When added in this way, the options available are the options applicable to <a href="Ext.core.Element.html#addListener" rel="Ext.core.Element#addListener" class="docClass">Ext.core.Element.addListener</a></p>
 181
 182
 183 <p></div></li>
 184 </ul><br></p>
 185
 186 <p>
 187 <b>Combining Options</b><br>
 188 Using the options argument, it is possible to combine different types of listeners:<br>
 189 <br>
 190 A delayed, one-time listener.
 191 <pre><code>myPanel.on('hide', this.handleClick, this, {
 192 single: true,
 193 delay: 100
 194 });</code></pre>
 195 <p>
 196 <b>Attaching multiple handlers in 1 call</b><br>
 197 The method also allows for a single argument to be passed which is a config object containing properties
 198 which specify multiple events. For example:
 199 <pre><code>myGridPanel.on({
 200     cellClick: this.onCellClick,
 201     mouseover: this.onMouseOver,
 202     mouseout: this.onMouseOut,
 203     scope: this // Important. Ensure "this" is correct during handler execution
 204 });
 205 </code></pre>.
 206 <p>
 207
 208 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 209 </li></ul></div></div></div><div id="method-addManagedListener" class="member inherited"><a href="Ext.grid.plugin.CellEditing.html#method-addManagedListener" rel="method-addManagedListener" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-addManagedListener" class="viewSource">view source</a></div><a name="addManagedListener"></a><a name="method-addManagedListener"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="method-addManagedListener" class="cls expand">addManagedListener</a>(
 210 <span class="pre">Observable/Element item, Object/String ename, Function fn, Object scope, Object opt</span>)
 211  : void</div><div class="description"><div class="short"><p>Adds listeners to any Observable object (or Element) which are automatically removed when this Component
 212 is destroyed.
 213
 214 </div><div class="long"><p>Adds listeners to any Observable object (or Element) which are automatically removed when this Component
 215 is destroyed.
 216
 217 <h3 class="pa">Parameters</h3><ul><li><span class="pre">item</span> : Observable/Element<div class="sub-desc"><p>The item to which to add a listener/listeners.</p>
 218 </div></li><li><span class="pre">ename</span> : Object/String<div class="sub-desc"><p>The event name, or an object containing event name properties.</p>
 219 </div></li><li><span class="pre">fn</span> : Function<div class="sub-desc"><p>Optional. If the <code>ename</code> parameter was an event name, this
 220 is the handler function.</p>
 221 </div></li><li><span class="pre">scope</span> : Object<div class="sub-desc"><p>Optional. If the <code>ename</code> parameter was an event name, this
 222 is the scope (<code>this</code> reference) in which the handler function is executed.</p>
 223 </div></li><li><span class="pre">opt</span> : Object<div class="sub-desc"><p>Optional. If the <code>ename</code> parameter was an event name, this
 224 is the <a href="Ext.util.Observable.html#addListener" rel="Ext.util.Observable#addListener" class="docClass">addListener</a> options.</p>
 225 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 226 </li></ul></div></div></div><div id="method-cancelEdit" class="member ni"><a href="Ext.grid.plugin.CellEditing.html#method-cancelEdit" rel="method-cancelEdit" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.grid.plugin.CellEditing.html" class="definedIn docClass">Ext.grid.plugin.CellEditing</a><br/><a href="../source/CellEditing.html#Ext-grid.plugin.CellEditing-method-cancelEdit" class="viewSource">view source</a></div><a name="cancelEdit"></a><a name="method-cancelEdit"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="method-cancelEdit" class="cls expand">cancelEdit</a> : void</div><div class="description"><div class="short"><p>Cancel any active editing.</p>
 227 </div><div class="long"><p>Cancel any active editing.</p>
 228 <h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 229 </li></ul></div></div></div><div id="method-capture" class="member inherited"><a href="Ext.grid.plugin.CellEditing.html#method-capture" rel="method-capture" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-capture" class="viewSource">view source</a></div><a name="capture"></a><a name="method-capture"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="method-capture" class="cls expand">capture</a>(
 230 <span class="pre">Observable o, Function fn, [Object scope]</span>)
 231  : void</div><div class="description"><div class="short">Starts capture on the specified Observable. All events will be passed
 232 to the supplied function with the event name + ...</div><div class="long"><p>Starts capture on the specified Observable. All events will be passed
 233 to the supplied function with the event name + standard signature of the event
 234 <b>before</b> the event is fired. If the supplied function returns false,
 235 the event will not fire.</p>
 236 <h3 class="pa">Parameters</h3><ul><li><span class="pre">o</span> : Observable<div class="sub-desc"><p>The Observable to capture events from.</p>
 237 </div></li><li><span class="pre">fn</span> : Function<div class="sub-desc"><p>The function to call when an event is fired.</p>
 238 </div></li><li><span class="pre">scope</span> : Object<div class="sub-desc"><p>(optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the Observable firing the event.</p>
 239 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 240 </li></ul></div></div></div><div id="method-clearListeners" class="member inherited"><a href="Ext.grid.plugin.CellEditing.html#method-clearListeners" rel="method-clearListeners" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-clearListeners" class="viewSource">view source</a></div><a name="clearListeners"></a><a name="method-clearListeners"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="method-clearListeners" class="cls expand">clearListeners</a> : void</div><div class="description"><div class="short"><p>Removes all listeners for this object including the managed listeners</p>
 241 </div><div class="long"><p>Removes all listeners for this object including the managed listeners</p>
 242 <h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 243 </li></ul></div></div></div><div id="method-clearManagedListeners" class="member inherited"><a href="Ext.grid.plugin.CellEditing.html#method-clearManagedListeners" rel="method-clearManagedListeners" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-clearManagedListeners" class="viewSource">view source</a></div><a name="clearManagedListeners"></a><a name="method-clearManagedListeners"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="method-clearManagedListeners" class="cls expand">clearManagedListeners</a> : void</div><div class="description"><div class="short"><p>Removes all managed listeners for this object.</p>
 244 </div><div class="long"><p>Removes all managed listeners for this object.</p>
 245 <h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 246 </li></ul></div></div></div><div id="method-completeEdit" class="member inherited"><a href="Ext.grid.plugin.CellEditing.html#method-completeEdit" rel="method-completeEdit" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.grid.plugin.Editing.html" class="definedIn docClass">Ext.grid.plugin.Editing</a><br/><a href="../source/Editing.html#Ext-grid.plugin.Editing-method-completeEdit" class="viewSource">view source</a></div><a name="completeEdit"></a><a name="method-completeEdit"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="method-completeEdit" class="cls expand">completeEdit</a> : void</div><div class="description"><div class="short"><p>Complete the edit if there is an active edit in progress.</p>
 247 </div><div class="long"><p>Complete the edit if there is an active edit in progress.</p>
 248 <h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 249 </li></ul></div></div></div><div id="method-enableBubble" class="member inherited"><a href="Ext.grid.plugin.CellEditing.html#method-enableBubble" rel="method-enableBubble" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-enableBubble" class="viewSource">view source</a></div><a name="enableBubble"></a><a name="method-enableBubble"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="method-enableBubble" class="cls expand">enableBubble</a>(
 250 <span class="pre">String/Array events</span>)
 251  : void</div><div class="description"><div class="short">Enables events fired by this Observable to bubble up an owner hierarchy by calling
 252 this.getBubbleTarget() if present....</div><div class="long"><p>Enables events fired by this Observable to bubble up an owner hierarchy by calling
 253 <code>this.getBubbleTarget()</code> if present. There is no implementation in the Observable base class.</p>
 254
 255
 256 <p>This is commonly used by Ext.Components to bubble events to owner Containers. See <a href="Ext.Component.html#getBubbleTarget" rel="Ext.Component#getBubbleTarget" class="docClass">Ext.Component.getBubbleTarget</a>. The default
 257 implementation in <a href="Ext.Component.html" rel="Ext.Component" class="docClass">Ext.Component</a> returns the Component's immediate owner. But if a known target is required, this can be overridden to
 258 access the required target more quickly.</p>
 259
 260
 261 <p>Example:</p>
 262
 263
 264 <pre><code>Ext.override(Ext.form.field.Base, {
 265 //  Add functionality to Field&#39;s initComponent to enable the change event to bubble
 266 initComponent : Ext.Function.createSequence(Ext.form.field.Base.prototype.initComponent, function() {
 267     this.enableBubble('change');
 268 }),
 269
 270 //  We know that we want Field&#39;s events to bubble directly to the FormPanel.
 271 getBubbleTarget : function() {
 272     if (!this.formPanel) {
 273         this.formPanel = this.findParentByType('form');
 274     }
 275     return this.formPanel;
 276 }
 277 });
 278
 279 var myForm = new Ext.formPanel({
 280 title: 'User Details',
 281 items: [{
 282     ...
 283 }],
 284 listeners: {
 285     change: function() {
 286         // Title goes red if form has been modified.
 287         myForm.header.setStyle('color', 'red');
 288     }
 289 }
 290 });
 291 </code></pre>
 292
 293 <h3 class="pa">Parameters</h3><ul><li><span class="pre">events</span> : String/Array<div class="sub-desc"><p>The event name to bubble, or an Array of event names.</p>
 294 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 295 </li></ul></div></div></div><div id="method-fireEvent" class="member inherited"><a href="Ext.grid.plugin.CellEditing.html#method-fireEvent" rel="method-fireEvent" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-fireEvent" class="viewSource">view source</a></div><a name="fireEvent"></a><a name="method-fireEvent"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="method-fireEvent" class="cls expand">fireEvent</a>(
 296 <span class="pre">String eventName, Object... args</span>)
 297  : Boolean</div><div class="description"><div class="short">Fires the specified event with the passed parameters (minus the event name).
 298
 299
 300 An event may be set to bubble up an Ob...</div><div class="long"><p>Fires the specified event with the passed parameters (minus the event name).</p>
 301
 302
 303 <p>An event may be set to bubble up an Observable parent hierarchy (See <a href="Ext.Component.html#getBubbleTarget" rel="Ext.Component#getBubbleTarget" class="docClass">Ext.Component.getBubbleTarget</a>)
 304 by calling <a href="Ext.grid.plugin.CellEditing.html#enableBubble" rel="Ext.grid.plugin.CellEditing#enableBubble" class="docClass">enableBubble</a>.</p>
 305
 306 <h3 class="pa">Parameters</h3><ul><li><span class="pre">eventName</span> : String<div class="sub-desc"><p>The name of the event to fire.</p>
 307 </div></li><li><span class="pre">args</span> : Object...<div class="sub-desc"><p>Variable number of parameters are passed to handlers.</p>
 308 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">Boolean</span>&nbsp; &nbsp;<p>returns false if any of the handlers return false otherwise it returns true.</p>
 309 </li></ul></div></div></div><div id="method-hasListener" class="member inherited"><a href="Ext.grid.plugin.CellEditing.html#method-hasListener" rel="method-hasListener" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-hasListener" class="viewSource">view source</a></div><a name="hasListener"></a><a name="method-hasListener"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="method-hasListener" class="cls expand">hasListener</a>(
 310 <span class="pre">String eventName</span>)
 311  : Boolean</div><div class="description"><div class="short"><p>Checks to see if this object has any listeners for a specified event</p>
 312 </div><div class="long"><p>Checks to see if this object has any listeners for a specified event</p>
 313 <h3 class="pa">Parameters</h3><ul><li><span class="pre">eventName</span> : String<div class="sub-desc"><p>The name of the event to check for</p>
 314 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">Boolean</span>&nbsp; &nbsp;<p>True if the event is being listened for, else false</p>
 315 </li></ul></div></div></div><div id="method-observe" class="member inherited"><a href="Ext.grid.plugin.CellEditing.html#method-observe" rel="method-observe" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-observe" class="viewSource">view source</a></div><a name="observe"></a><a name="method-observe"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="method-observe" class="cls expand">observe</a>(
 316 <span class="pre">Function c, Object listeners</span>)
 317  : void</div><div class="description"><div class="short">Sets observability on the passed class constructor.
 318
 319 This makes any event fired on any instance of the passed class a...</div><div class="long"><p>Sets observability on the passed class constructor.</p>
 320
 321 <p>This makes any event fired on any instance of the passed class also fire a single event through
 322 the <strong>class</strong> allowing for central handling of events on many instances at once.</p>
 323
 324 <p>Usage:</p>
 325
 326 <pre><code>Ext.util.Observable.observe(Ext.data.Connection);
 327 Ext.data.Connection.on('beforerequest', function(con, options) {
 328     console.log('Ajax request made to ' + options.url);
 329 });
 330 </code></pre>
 331 <h3 class="pa">Parameters</h3><ul><li><span class="pre">c</span> : Function<div class="sub-desc"><p>The class constructor to make observable.</p>
 332 </div></li><li><span class="pre">listeners</span> : Object<div class="sub-desc"><p>An object containing a series of listeners to add. See <a href="Ext.grid.plugin.CellEditing.html#addListener" rel="Ext.grid.plugin.CellEditing#addListener" class="docClass">addListener</a>.</p>
 333 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 334 </li></ul></div></div></div><div id="method-on" class="member inherited"><a href="Ext.grid.plugin.CellEditing.html#method-on" rel="method-on" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-on" class="viewSource">view source</a></div><a name="on"></a><a name="method-on"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="method-on" class="cls expand">on</a>(
 335 <span class="pre">String eventName, Function handler, [Object scope], [Object options]</span>)
 336  : void</div><div class="description"><div class="short"><p>Appends an event handler to this object (shorthand for <a href="Ext.grid.plugin.CellEditing.html#addListener" rel="Ext.grid.plugin.CellEditing#addListener" class="docClass">addListener</a>.)</p>
 337 </div><div class="long"><p>Appends an event handler to this object (shorthand for <a href="Ext.grid.plugin.CellEditing.html#addListener" rel="Ext.grid.plugin.CellEditing#addListener" class="docClass">addListener</a>.)</p>
 338 <h3 class="pa">Parameters</h3><ul><li><span class="pre">eventName</span> : String<div class="sub-desc"><p>The type of event to listen for</p>
 339 </div></li><li><span class="pre">handler</span> : Function<div class="sub-desc"><p>The method the event invokes</p>
 340 </div></li><li><span class="pre">scope</span> : Object<div class="sub-desc"><p>(optional) The scope (<code><b>this</b></code> reference) in which the handler function is executed.
 341 <b>If omitted, defaults to the object which fired the event.</b></p>
 342 </div></li><li><span class="pre">options</span> : Object<div class="sub-desc"><p>(optional) An object containing handler configuration.</p>
 343 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 344 </li></ul></div></div></div><div id="method-relayEvents" class="member inherited"><a href="Ext.grid.plugin.CellEditing.html#method-relayEvents" rel="method-relayEvents" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-relayEvents" class="viewSource">view source</a></div><a name="relayEvents"></a><a name="method-relayEvents"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="method-relayEvents" class="cls expand">relayEvents</a>(
 345 <span class="pre">Object origin, Array events, Object prefix</span>)
 346  : void</div><div class="description"><div class="short"><p>Relays selected events from the specified Observable as if the events were fired by <code><b>this</b></code>.</p>
 347 </div><div class="long"><p>Relays selected events from the specified Observable as if the events were fired by <code><b>this</b></code>.</p>
 348 <h3 class="pa">Parameters</h3><ul><li><span class="pre">origin</span> : Object<div class="sub-desc"><p>The Observable whose events this object is to relay.</p>
 349 </div></li><li><span class="pre">events</span> : Array<div class="sub-desc"><p>Array of event names to relay.</p>
 350 </div></li><li><span class="pre">prefix</span> : Object<div class="sub-desc">
 351 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 352 </li></ul></div></div></div><div id="method-releaseCapture" class="member inherited"><a href="Ext.grid.plugin.CellEditing.html#method-releaseCapture" rel="method-releaseCapture" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-releaseCapture" class="viewSource">view source</a></div><a name="releaseCapture"></a><a name="method-releaseCapture"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="method-releaseCapture" class="cls expand">releaseCapture</a>(
 353 <span class="pre">Observable o</span>)
 354  : void</div><div class="description"><div class="short"><p>Removes <b>all</b> added captures from the Observable.</p>
 355 </div><div class="long"><p>Removes <b>all</b> added captures from the Observable.</p>
 356 <h3 class="pa">Parameters</h3><ul><li><span class="pre">o</span> : Observable<div class="sub-desc"><p>The Observable to release</p>
 357 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 358 </li></ul></div></div></div><div id="method-removeListener" class="member inherited"><a href="Ext.grid.plugin.CellEditing.html#method-removeListener" rel="method-removeListener" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-removeListener" class="viewSource">view source</a></div><a name="removeListener"></a><a name="method-removeListener"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="method-removeListener" class="cls expand">removeListener</a>(
 359 <span class="pre">String eventName, Function handler, [Object scope]</span>)
 360  : void</div><div class="description"><div class="short"><p>Removes an event handler.</p>
 361 </div><div class="long"><p>Removes an event handler.</p>
 362 <h3 class="pa">Parameters</h3><ul><li><span class="pre">eventName</span> : String<div class="sub-desc"><p>The type of event the handler was associated with.</p>
 363 </div></li><li><span class="pre">handler</span> : Function<div class="sub-desc"><p>The handler to remove. <b>This must be a reference to the function passed into the <a href="Ext.grid.plugin.CellEditing.html#addListener" rel="Ext.grid.plugin.CellEditing#addListener" class="docClass">addListener</a> call.</b></p>
 364 </div></li><li><span class="pre">scope</span> : Object<div class="sub-desc"><p>(optional) The scope originally specified for the handler.</p>
 365 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 366 </li></ul></div></div></div><div id="method-removeManagedListener" class="member inherited"><a href="Ext.grid.plugin.CellEditing.html#method-removeManagedListener" rel="method-removeManagedListener" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-removeManagedListener" class="viewSource">view source</a></div><a name="removeManagedListener"></a><a name="method-removeManagedListener"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="method-removeManagedListener" class="cls expand">removeManagedListener</a>(
 367 <span class="pre">Observable|Element item, Object|String ename, Function fn, Object scope</span>)
 368  : void</div><div class="description"><div class="short"><p>Removes listeners that were added by the <a href="Ext.grid.plugin.CellEditing.html#mon" rel="Ext.grid.plugin.CellEditing#mon" class="docClass">mon</a> method.</p>
 369 </div><div class="long"><p>Removes listeners that were added by the <a href="Ext.grid.plugin.CellEditing.html#mon" rel="Ext.grid.plugin.CellEditing#mon" class="docClass">mon</a> method.</p>
 370 <h3 class="pa">Parameters</h3><ul><li><span class="pre">item</span> : Observable|Element<div class="sub-desc"><p>The item from which to remove a listener/listeners.</p>
 371 </div></li><li><span class="pre">ename</span> : Object|String<div class="sub-desc"><p>The event name, or an object containing event name properties.</p>
 372 </div></li><li><span class="pre">fn</span> : Function<div class="sub-desc"><p>Optional. If the <code>ename</code> parameter was an event name, this
 373 is the handler function.</p>
 374 </div></li><li><span class="pre">scope</span> : Object<div class="sub-desc"><p>Optional. If the <code>ename</code> parameter was an event name, this
 375 is the scope (<code>this</code> reference) in which the handler function is executed.</p>
 376 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 377 </li></ul></div></div></div><div id="method-resumeEvents" class="member inherited"><a href="Ext.grid.plugin.CellEditing.html#method-resumeEvents" rel="method-resumeEvents" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-resumeEvents" class="viewSource">view source</a></div><a name="resumeEvents"></a><a name="method-resumeEvents"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="method-resumeEvents" class="cls expand">resumeEvents</a> : void</div><div class="description"><div class="short">Resume firing events. (see suspendEvents)
 378 If events were suspended using the queueSuspended parameter, then all
 379 event...</div><div class="long"><p>Resume firing events. (see <a href="Ext.grid.plugin.CellEditing.html#suspendEvents" rel="Ext.grid.plugin.CellEditing#suspendEvents" class="docClass">suspendEvents</a>)
 380 If events were suspended using the <code><b>queueSuspended</b></code> parameter, then all
 381 events fired during event suspension will be sent to any listeners now.</p>
 382 <h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 383 </li></ul></div></div></div><div id="method-startEdit" class="member ni"><a href="Ext.grid.plugin.CellEditing.html#method-startEdit" rel="method-startEdit" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.grid.plugin.CellEditing.html" class="definedIn docClass">Ext.grid.plugin.CellEditing</a><br/><a href="../source/CellEditing.html#Ext-grid.plugin.CellEditing-method-startEdit" class="viewSource">view source</a></div><a name="startEdit"></a><a name="method-startEdit"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="method-startEdit" class="cls expand">startEdit</a>(
 384 <span class="pre">Model record, Model columnHeader</span>)
 385  : void</div><div class="description"><div class="short"><p>Start editing the specified record, using the specified Column definition to define which field is being edited.</p>
 386 </div><div class="long"><p>Start editing the specified record, using the specified Column definition to define which field is being edited.</p>
 387 <h3 class="pa">Parameters</h3><ul><li><span class="pre">record</span> : Model<div class="sub-desc"><p>The Store data record which backs the row to be edited.</p>
 388 </div></li><li><span class="pre">columnHeader</span> : Model<div class="sub-desc"><p>The Column object defining the column to be edited.
 389 @override</p>
 390 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 391 </li></ul></div></div></div><div id="method-startEditByPosition" class="member ni"><a href="Ext.grid.plugin.CellEditing.html#method-startEditByPosition" rel="method-startEditByPosition" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.grid.plugin.CellEditing.html" class="definedIn docClass">Ext.grid.plugin.CellEditing</a><br/><a href="../source/CellEditing.html#Ext-grid.plugin.CellEditing-method-startEditByPosition" class="viewSource">view source</a></div><a name="startEditByPosition"></a><a name="method-startEditByPosition"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="method-startEditByPosition" class="cls expand">startEditByPosition</a>(
 392 <span class="pre">Object position</span>)
 393  : void</div><div class="description"><div class="short"><p>Starts editing by position (row/column)</p>
 394 </div><div class="long"><p>Starts editing by position (row/column)</p>
 395 <h3 class="pa">Parameters</h3><ul><li><span class="pre">position</span> : Object<div class="sub-desc"><p>A position with keys of row and column.</p>
 396 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 397 </li></ul></div></div></div><div id="method-suspendEvents" class="member inherited"><a href="Ext.grid.plugin.CellEditing.html#method-suspendEvents" rel="method-suspendEvents" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-suspendEvents" class="viewSource">view source</a></div><a name="suspendEvents"></a><a name="method-suspendEvents"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="method-suspendEvents" class="cls expand">suspendEvents</a>(
 398 <span class="pre">Boolean queueSuspended</span>)
 399  : void</div><div class="description"><div class="short"><p>Suspend the firing of all events. (see <a href="Ext.grid.plugin.CellEditing.html#resumeEvents" rel="Ext.grid.plugin.CellEditing#resumeEvents" class="docClass">resumeEvents</a>)</p>
 400 </div><div class="long"><p>Suspend the firing of all events. (see <a href="Ext.grid.plugin.CellEditing.html#resumeEvents" rel="Ext.grid.plugin.CellEditing#resumeEvents" class="docClass">resumeEvents</a>)</p>
 401 <h3 class="pa">Parameters</h3><ul><li><span class="pre">queueSuspended</span> : Boolean<div class="sub-desc"><p>Pass as true to queue up suspended events to be fired
 402 after the <a href="Ext.grid.plugin.CellEditing.html#resumeEvents" rel="Ext.grid.plugin.CellEditing#resumeEvents" class="docClass">resumeEvents</a> call instead of discarding all suspended events;</p>
 403 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 404 </li></ul></div></div></div><div id="method-un" class="member inherited"><a href="Ext.grid.plugin.CellEditing.html#method-un" rel="method-un" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-un" class="viewSource">view source</a></div><a name="un"></a><a name="method-un"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="method-un" class="cls expand">un</a>(
 405 <span class="pre">String eventName, Function handler, [Object scope]</span>)
 406  : void</div><div class="description"><div class="short"><p>Removes an event handler (shorthand for <a href="Ext.grid.plugin.CellEditing.html#removeListener" rel="Ext.grid.plugin.CellEditing#removeListener" class="docClass">removeListener</a>.)</p>
 407 </div><div class="long"><p>Removes an event handler (shorthand for <a href="Ext.grid.plugin.CellEditing.html#removeListener" rel="Ext.grid.plugin.CellEditing#removeListener" class="docClass">removeListener</a>.)</p>
 408 <h3 class="pa">Parameters</h3><ul><li><span class="pre">eventName</span> : String<div class="sub-desc"><p>The type of event the handler was associated with.</p>
 409 </div></li><li><span class="pre">handler</span> : Function<div class="sub-desc"><p>The handler to remove. <b>This must be a reference to the function passed into the <a href="Ext.grid.plugin.CellEditing.html#addListener" rel="Ext.grid.plugin.CellEditing#addListener" class="docClass">addListener</a> call.</b></p>
 410 </div></li><li><span class="pre">scope</span> : Object<div class="sub-desc"><p>(optional) The scope originally specified for the handler.</p>
 411 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 412 </li></ul></div></div></div></div><div class="m-events"><a name="events"></a><div class="definedBy">Defined By</div><h3 class="evt p">Events</h3><div id="event-beforeedit" class="member f ni"><a href="Ext.grid.plugin.CellEditing.html#event-beforeedit" rel="event-beforeedit" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.grid.plugin.CellEditing.html" class="definedIn docClass">Ext.grid.plugin.CellEditing</a><br/><a href="../source/CellEditing.html#Ext-grid.plugin.CellEditing-event-beforeedit" class="viewSource">view source</a></div><a name="beforeedit"></a><a name="event-beforeedit"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="event-beforeedit" class="cls expand">beforeedit</a>(
 413 <span class="pre">Ext.grid.plugin.Editing editor, Object e</span>)
 414 </div><div class="description"><div class="short">Fires before cell editing is triggered. The edit event object has the following properties
 415
 416
 417 grid - The grid
 418 record ...</div><div class="long"><p>Fires before cell editing is triggered. The edit event object has the following properties <br /></p>
 419
 420 <ul style="padding:5px;padding-left:16px;">
 421 <li>grid - The grid</li>
 422 <li>record - The record being edited</li>
 423 <li>field - The field name being edited</li>
 424 <li>value - The value for the field being edited.</li>
 425 <li>row - The grid table row</li>
 426 <li>column - The grid <a href="Ext.grid.column.Column.html" rel="Ext.grid.column.Column" class="docClass">Column</a> defining the column that is being edited.</li>
 427 <li>rowIdx - The row index that is being edited</li>
 428 <li>colIdx - The column index that is being edited</li>
 429 <li>cancel - Set this to true to cancel the edit or return false from your handler.</li>
 430 </ul>
 431
 432 <h3 class="pa">Parameters</h3><ul><li><span class="pre">editor</span> : Ext.grid.plugin.Editing<div class="sub-desc">
 433 </div></li><li><span class="pre">e</span> : Object<div class="sub-desc"><p>An edit event (see above for description)</p>
 434 </div></li></ul></div></div></div><div id="event-edit" class="member ni"><a href="Ext.grid.plugin.CellEditing.html#event-edit" rel="event-edit" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.grid.plugin.CellEditing.html" class="definedIn docClass">Ext.grid.plugin.CellEditing</a><br/><a href="../source/CellEditing.html#Ext-grid.plugin.CellEditing-event-edit" class="viewSource">view source</a></div><a name="edit"></a><a name="event-edit"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="event-edit" class="cls expand">edit</a>(
 435 <span class="pre">Ext.grid.plugin.Editing editor, Object e</span>)
 436 </div><div class="description"><div class="short">Fires after a cell is edited. The edit event object has the following properties
 437
 438
 439 grid - The grid
 440 record - The reco...</div><div class="long"><p>Fires after a cell is edited. The edit event object has the following properties <br /></p>
 441
 442 <ul style="padding:5px;padding-left:16px;">
 443 <li>grid - The grid</li>
 444 <li>record - The record that was edited</li>
 445 <li>field - The field name that was edited</li>
 446 <li>value - The value being set</li>
 447 <li>originalValue - The original value for the field, before the edit.</li>
 448 <li>row - The grid table row</li>
 449 <li>column - The grid <a href="Ext.grid.column.Column.html" rel="Ext.grid.column.Column" class="docClass">Column</a> defining the column that was edited.</li>
 450 <li>rowIdx - The row index that was edited</li>
 451 <li>colIdx - The column index that was edited</li>
 452 </ul>
 453
 454
 455
 456
 457 <pre><code>grid.on('edit', onEdit, this);
 458
 459 function onEdit(e) {
 460     // execute an XHR to send/commit data to the server, in callback do (if successful):
 461     e.record.commit();
 462 };
 463 </code></pre>
 464
 465 <h3 class="pa">Parameters</h3><ul><li><span class="pre">editor</span> : Ext.grid.plugin.Editing<div class="sub-desc">
 466 </div></li><li><span class="pre">e</span> : Object<div class="sub-desc"><p>An edit event (see above for description)</p>
 467 </div></li></ul></div></div></div><div id="event-validateedit" class="member ni"><a href="Ext.grid.plugin.CellEditing.html#event-validateedit" rel="event-validateedit" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.grid.plugin.CellEditing.html" class="definedIn docClass">Ext.grid.plugin.CellEditing</a><br/><a href="../source/CellEditing.html#Ext-grid.plugin.CellEditing-event-validateedit" class="viewSource">view source</a></div><a name="validateedit"></a><a name="event-validateedit"></a><a href="Ext.grid.plugin.CellEditing.html#" rel="event-validateedit" class="cls expand">validateedit</a>(
 468 <span class="pre">Ext.grid.plugin.Editing editor, Object e</span>)
 469 </div><div class="description"><div class="short">Fires after a cell is edited, but before the value is set in the record. Return false
 470 to cancel the change. The edit ...</div><div class="long"><p>Fires after a cell is edited, but before the value is set in the record. Return false
 471 to cancel the change. The edit event object has the following properties <br /></p>
 472
 473 <ul style="padding:5px;padding-left:16px;">
 474 <li>grid - The grid</li>
 475 <li>record - The record being edited</li>
 476 <li>field - The field name being edited</li>
 477 <li>value - The value being set</li>
 478 <li>originalValue - The original value for the field, before the edit.</li>
 479 <li>row - The grid table row</li>
 480 <li>column - The grid <a href="Ext.grid.column.Column.html" rel="Ext.grid.column.Column" class="docClass">Column</a> defining the column that is being edited.</li>
 481 <li>rowIdx - The row index that is being edited</li>
 482 <li>colIdx - The column index that is being edited</li>
 483 <li>cancel - Set this to true to cancel the edit or return false from your handler.</li>
 484 </ul>
 485
 486
 487 <p>Usage example showing how to remove the red triangle (dirty record indicator) from some
 488 records (not all).  By observing the grid's validateedit event, it can be cancelled if
 489 the edit occurs on a targeted row (for example) and then setting the field's new value
 490 in the Record directly:</p>
 491
 492 <pre><code>grid.on('validateedit', function(e) {
 493   var myTargetRow = 6;
 494
 495   if (e.row == myTargetRow) {
 496     e.cancel = true;
 497     e.record.data[e.field] = e.value;
 498   }
 499 });
 500 </code></pre>
 501
 502 <h3 class="pa">Parameters</h3><ul><li><span class="pre">editor</span> : Ext.grid.plugin.Editing<div class="sub-desc">
 503 </div></li><li><span class="pre">e</span> : Object<div class="sub-desc"><p>An edit event (see above for description)</p>
 504 </div></li></ul></div></div></div></div></div></div></div><div id="pageContent"></div></div></div></div></body></html>