Upgrade to ExtJS 4.0.0 - Released 04/26/2011
[extjs.git] / docs / api / Ext.grid.plugin.RowEditing.html
1 <!DOCTYPE html><html><head><title>Ext.grid.plugin.RowEditing | 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.RowEditing',
13         docClass: 'Ext.grid.plugin.RowEditing',
14         docReq: 'Ext.grid.plugin.RowEditing',
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 = 'RowEditing.html#Ext-grid.plugin.RowEditing';
33     clsInfo = {"methods":["addEvents","addListener","addManagedListener","cancelEdit","capture","clearListeners","clearManagedListeners","completeEdit","enableBubble","fireEvent","hasListener","observe","on","relayEvents","releaseCapture","removeListener","removeManagedListener","resumeEvents","startEdit","suspendEvents","un"],"cfgs":["autoCancel","clicksToEdit","clicksToMoveEditor","errorSummary","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/RowEditing.html#Ext-grid.plugin.RowEditing" target="_blank">Ext.grid.plugin.RowEditing</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.RowEditing</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.RowEditing.html" rel="Ext.grid.plugin.RowEditing" class="docClass">Ext.grid.plugin.RowEditing</a> plugin injects editing at a row level for a Grid. When editing begins,
38 a small floating dialog will be shown for the appropriate row. Each editable column will show a field
39 for editing. There is a button to save or cancel all changes for the edit.</p>
40
41 <p>The field that will be used for the editor is defined at the
42 <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.
43 If an editor is not specified for a particular column then that column won't be editable and the value of
44 the column will be displayed.</p>
45
46 <p>The editor may be shared for each column in the grid, or a different one may be specified for each column.
47 An appropriate field type should be chosen to match the data structure that it will be editing. For example,
48 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>
49
50 <p><img class="screenshot" src="../Ext.grid.plugin.RowEditing.png" alt="Ext.grid.plugin.RowEditing plugin" /></p>
51
52 <h2>Example Usage</h2>
53
54 <pre class="prettyprint"><code>Ext.create('Ext.data.Store', {
55     storeId:'simpsonsStore',
56     fields:['name', 'email', 'phone'],
57     data:{'items':[
58         {"name":"Lisa", "email":"lisa@simpsons.com", "phone":"555-111-1224"},
59         {"name":"Bart", "email":"bart@simpsons.com", "phone":"555--222-1234"},
60         {"name":"Homer", "email":"home@simpsons.com", "phone":"555-222-1244"},                        
61         {"name":"Marge", "email":"marge@simpsons.com", "phone":"555-222-1254"}            
62     ]},
63     proxy: {
64         type: 'memory',
65         reader: {
66             type: 'json',
67             root: 'items'
68         }
69     }
70 });
71
72 Ext.create('Ext.grid.Panel', {
73     title: 'Simpsons',
74     store: Ext.data.StoreManager.lookup('simpsonsStore'),
75     columns: [
76         {header: 'Name',  dataIndex: 'name', field: 'textfield'},
77         {header: 'Email', dataIndex: 'email', flex:1, 
78             editor: {
79                 xtype:'textfield',
80                 allowBlank:false
81             }
82         },
83         {header: 'Phone', dataIndex: 'phone'}
84     ],
85     selType: 'rowmodel',
86     plugins: [
87         Ext.create('Ext.grid.plugin.RowEditing', {
88             clicksToEdit: 1
89         })
90     ],
91     height: 200,
92     width: 400,
93     renderTo: Ext.getBody()
94 });
95 </code></pre>
96 <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-autoCancel" class="member f ni"><a href="Ext.grid.plugin.RowEditing.html#config-autoCancel" rel="config-autoCancel" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.grid.plugin.RowEditing.html" class="definedIn docClass">Ext.grid.plugin.RowEditing</a><br/><a href="../source/RowEditing.html#Ext-grid.plugin.RowEditing-cfg-autoCancel" class="viewSource">view source</a></div><a name="autoCancel"></a><a name="config-autoCancel"></a><a href="Ext.grid.plugin.RowEditing.html#" rel="config-autoCancel" class="cls expand">autoCancel</a><span> : Boolean</span></div><div class="description"><div class="short">true to automatically cancel any pending changes when the row editor begins editing a new row.
97 false to force the use...</div><div class="long"><p><code>true</code> to automatically cancel any pending changes when the row editor begins editing a new row.
98 <code>false</code> to force the user to explicitly cancel the pending changes. Defaults to <code>true</code>.</p>
99 </div></div></div><div id="config-clicksToEdit" class="member inherited"><a href="Ext.grid.plugin.RowEditing.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.RowEditing.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>
100 </div><div class="long"><p>The number of clicks on a grid required to display the editor (defaults to 2).</p>
101 </div></div></div><div id="config-clicksToMoveEditor" class="member ni"><a href="Ext.grid.plugin.RowEditing.html#config-clicksToMoveEditor" rel="config-clicksToMoveEditor" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.grid.plugin.RowEditing.html" class="definedIn docClass">Ext.grid.plugin.RowEditing</a><br/><a href="../source/RowEditing.html#Ext-grid.plugin.RowEditing-cfg-clicksToMoveEditor" class="viewSource">view source</a></div><a name="clicksToMoveEditor"></a><a name="config-clicksToMoveEditor"></a><a href="Ext.grid.plugin.RowEditing.html#" rel="config-clicksToMoveEditor" class="cls expand">clicksToMoveEditor</a><span> : Number</span></div><div class="description"><div class="short">The number of clicks to move the row editor to a new row while it is visible and actively editing another row.
102 This w...</div><div class="long"><p>The number of clicks to move the row editor to a new row while it is visible and actively editing another row.
103 This will default to the same value as <a href="Ext.grid.plugin.Editing.html#clicksToEdit" rel="Ext.grid.plugin.Editing#clicksToEdit" class="docClass">clicksToEdit</a>.</p>
104 </div></div></div><div id="config-errorSummary" class="member ni"><a href="Ext.grid.plugin.RowEditing.html#config-errorSummary" rel="config-errorSummary" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.grid.plugin.RowEditing.html" class="definedIn docClass">Ext.grid.plugin.RowEditing</a><br/><a href="../source/RowEditing.html#Ext-grid.plugin.RowEditing-cfg-errorSummary" class="viewSource">view source</a></div><a name="errorSummary"></a><a name="config-errorSummary"></a><a href="Ext.grid.plugin.RowEditing.html#" rel="config-errorSummary" class="cls expand">errorSummary</a><span> : Boolean</span></div><div class="description"><div class="short">true to show a tooltip that summarizes all validation errors present
105 in the row editor. Set to false to prevent the t...</div><div class="long"><p><code>true</code> to show a <a href="Ext.tip.ToolTip.html" rel="Ext.tip.ToolTip" class="docClass">tooltip</a> that summarizes all validation errors present
106 in the row editor. Set to <code>false</code> to prevent the tooltip from showing. Defaults to <code>true</code>.</p>
107 </div></div></div><div id="config-listeners" class="member inherited"><a href="Ext.grid.plugin.RowEditing.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.RowEditing.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
108 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
109 object during initialization.  This should be a valid listeners config object as specified in the
110 <a href="Ext.grid.plugin.RowEditing.html#addListener" rel="Ext.grid.plugin.RowEditing#addListener" class="docClass">addListener</a> example for attaching multiple handlers at once.</p></p>
111
112 <br><p><b><u>DOM events from ExtJs <a href="Ext.Component.html" rel="Ext.Component" class="docClass">Components</a></u></b></p>
113
114
115 <br><p>While <i>some</i> ExtJs Component classes export selected DOM events (e.g. "click", "mouseover" etc), this
116
117
118 <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
119 <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
120 events directly from a child element of a Component, we need to specify the <code>element</code> option to
121 identify the Component property to add a DOM listener to:</p>
122
123 <pre><code>new Ext.panel.Panel({
124     width: 400,
125     height: 200,
126     dockedItems: [{
127         xtype: 'toolbar'
128     }],
129     listeners: {
130         click: {
131             element: 'el', //bind to the underlying el property on the panel
132             fn: function(){ console.log('click el'); }
133         },
134         dblclick: {
135             element: 'body', //bind to the underlying body property on the panel
136             fn: function(){ console.log('dblclick body'); }
137         }
138     }
139 });
140 </code></pre>
141
142
143 <p></p></p>
144 </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.RowEditing.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.RowEditing.html#" rel="method-addEvents" class="cls expand">addEvents</a>(
145 <span class="pre">Object/String o, String </span>)
146  : void</div><div class="description"><div class="short"><p>Adds the specified events to the list of events which this Observable may fire.</p>
147 </div><div class="long"><p>Adds the specified events to the list of events which this Observable may fire.</p>
148 <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>
149 or the first event name string if multiple event names are being passed as separate parameters.</p>
150 </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.
151 Usage:</p>
152
153 <pre><code>this.addEvents('storeloaded', 'storecleared');
154 </code></pre>
155
156 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
157 </li></ul></div></div></div><div id="method-addListener" class="member inherited"><a href="Ext.grid.plugin.RowEditing.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.RowEditing.html#" rel="method-addListener" class="cls expand">addListener</a>(
158 <span class="pre">String eventName, Function handler, [Object scope], [Object options]</span>)
159  : void</div><div class="description"><div class="short"><p>Appends an event handler to this object.</p>
160 </div><div class="long"><p>Appends an event handler to this object.</p>
161 <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>
162 </div></li><li><span class="pre">handler</span> : Function<div class="sub-desc"><p>The method the event invokes.</p>
163 </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.
164 <b>If omitted, defaults to the object which fired the event.</b></p>
165 </div></li><li><span class="pre">options</span> : Object<div class="sub-desc"><p>(optional) An object containing handler configuration.
166 properties. This may contain any of the following properties:<ul>
167 <li><b>scope</b> : Object<div class="sub-desc">The scope (<code><b>this</b></code> reference) in which the handler function is executed.
168 <b>If omitted, defaults to the object which fired the event.</b></div></li>
169 <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>
170 <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>
171 <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
172 by the specified number of milliseconds. If the event fires again within that time, the original
173 handler is <em>not</em> invoked, but the new handler is scheduled in its place.</div></li>
174 <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>
175 if the event was bubbled up from a child Observable.</div></li>
176 <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>
177 The name of a Component property which references an element to add a listener to.</p>
178
179 <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
180 will exist only after the Component is rendered. For example, to add a click listener to a Panel's body:
181 <pre><code>new Ext.panel.Panel({
182     title: 'The title',
183     listeners: {
184         click: this.handlePanelClick,
185         element: 'body'
186     }
187 });
188 </code></pre></p>
189
190
191 <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>
192
193
194 <p></div></li>
195 </ul><br></p>
196
197 <p>
198 <b>Combining Options</b><br>
199 Using the options argument, it is possible to combine different types of listeners:<br>
200 <br>
201 A delayed, one-time listener.
202 <pre><code>myPanel.on('hide', this.handleClick, this, {
203 single: true,
204 delay: 100
205 });</code></pre>
206 <p>
207 <b>Attaching multiple handlers in 1 call</b><br>
208 The method also allows for a single argument to be passed which is a config object containing properties
209 which specify multiple events. For example:
210 <pre><code>myGridPanel.on({
211     cellClick: this.onCellClick,
212     mouseover: this.onMouseOver,
213     mouseout: this.onMouseOut,
214     scope: this // Important. Ensure "this" is correct during handler execution
215 });
216 </code></pre>.
217 <p>
218
219 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
220 </li></ul></div></div></div><div id="method-addManagedListener" class="member inherited"><a href="Ext.grid.plugin.RowEditing.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.RowEditing.html#" rel="method-addManagedListener" class="cls expand">addManagedListener</a>(
221 <span class="pre">Observable/Element item, Object/String ename, Function fn, Object scope, Object opt</span>)
222  : void</div><div class="description"><div class="short"><p>Adds listeners to any Observable object (or Element) which are automatically removed when this Component
223 is destroyed.
224
225 </div><div class="long"><p>Adds listeners to any Observable object (or Element) which are automatically removed when this Component
226 is destroyed.
227
228 <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>
229 </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>
230 </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
231 is the handler function.</p>
232 </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
233 is the scope (<code>this</code> reference) in which the handler function is executed.</p>
234 </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
235 is the <a href="Ext.util.Observable.html#addListener" rel="Ext.util.Observable#addListener" class="docClass">addListener</a> options.</p>
236 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
237 </li></ul></div></div></div><div id="method-cancelEdit" class="member inherited"><a href="Ext.grid.plugin.RowEditing.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.Editing.html" class="definedIn docClass">Ext.grid.plugin.Editing</a><br/><a href="../source/Editing.html#Ext-grid.plugin.Editing-method-cancelEdit" class="viewSource">view source</a></div><a name="cancelEdit"></a><a name="method-cancelEdit"></a><a href="Ext.grid.plugin.RowEditing.html#" rel="method-cancelEdit" class="cls expand">cancelEdit</a> : void</div><div class="description"><div class="short"><p>Cancel any active edit that is in progress.</p>
238 </div><div class="long"><p>Cancel any active edit that is in progress.</p>
239 <h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
240 </li></ul></div></div></div><div id="method-capture" class="member inherited"><a href="Ext.grid.plugin.RowEditing.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.RowEditing.html#" rel="method-capture" class="cls expand">capture</a>(
241 <span class="pre">Observable o, Function fn, [Object scope]</span>)
242  : void</div><div class="description"><div class="short">Starts capture on the specified Observable. All events will be passed
243 to the supplied function with the event name + ...</div><div class="long"><p>Starts capture on the specified Observable. All events will be passed
244 to the supplied function with the event name + standard signature of the event
245 <b>before</b> the event is fired. If the supplied function returns false,
246 the event will not fire.</p>
247 <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>
248 </div></li><li><span class="pre">fn</span> : Function<div class="sub-desc"><p>The function to call when an event is fired.</p>
249 </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>
250 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
251 </li></ul></div></div></div><div id="method-clearListeners" class="member inherited"><a href="Ext.grid.plugin.RowEditing.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.RowEditing.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>
252 </div><div class="long"><p>Removes all listeners for this object including the managed listeners</p>
253 <h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
254 </li></ul></div></div></div><div id="method-clearManagedListeners" class="member inherited"><a href="Ext.grid.plugin.RowEditing.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.RowEditing.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>
255 </div><div class="long"><p>Removes all managed listeners for this object.</p>
256 <h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
257 </li></ul></div></div></div><div id="method-completeEdit" class="member inherited"><a href="Ext.grid.plugin.RowEditing.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.RowEditing.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>
258 </div><div class="long"><p>Complete the edit if there is an active edit in progress.</p>
259 <h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
260 </li></ul></div></div></div><div id="method-enableBubble" class="member inherited"><a href="Ext.grid.plugin.RowEditing.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.RowEditing.html#" rel="method-enableBubble" class="cls expand">enableBubble</a>(
261 <span class="pre">String/Array events</span>)
262  : void</div><div class="description"><div class="short">Enables events fired by this Observable to bubble up an owner hierarchy by calling
263 this.getBubbleTarget() if present....</div><div class="long"><p>Enables events fired by this Observable to bubble up an owner hierarchy by calling
264 <code>this.getBubbleTarget()</code> if present. There is no implementation in the Observable base class.</p>
265
266
267 <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
268 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
269 access the required target more quickly.</p>
270
271
272 <p>Example:</p>
273
274
275 <pre><code>Ext.override(Ext.form.field.Base, {
276 //  Add functionality to Field&#39;s initComponent to enable the change event to bubble
277 initComponent : Ext.Function.createSequence(Ext.form.field.Base.prototype.initComponent, function() {
278     this.enableBubble('change');
279 }),
280
281 //  We know that we want Field&#39;s events to bubble directly to the FormPanel.
282 getBubbleTarget : function() {
283     if (!this.formPanel) {
284         this.formPanel = this.findParentByType('form');
285     }
286     return this.formPanel;
287 }
288 });
289
290 var myForm = new Ext.formPanel({
291 title: 'User Details',
292 items: [{
293     ...
294 }],
295 listeners: {
296     change: function() {
297         // Title goes red if form has been modified.
298         myForm.header.setStyle('color', 'red');
299     }
300 }
301 });
302 </code></pre>
303
304 <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>
305 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
306 </li></ul></div></div></div><div id="method-fireEvent" class="member inherited"><a href="Ext.grid.plugin.RowEditing.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.RowEditing.html#" rel="method-fireEvent" class="cls expand">fireEvent</a>(
307 <span class="pre">String eventName, Object... args</span>)
308  : Boolean</div><div class="description"><div class="short">Fires the specified event with the passed parameters (minus the event name).
309
310
311 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>
312
313
314 <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>)
315 by calling <a href="Ext.grid.plugin.RowEditing.html#enableBubble" rel="Ext.grid.plugin.RowEditing#enableBubble" class="docClass">enableBubble</a>.</p>
316
317 <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>
318 </div></li><li><span class="pre">args</span> : Object...<div class="sub-desc"><p>Variable number of parameters are passed to handlers.</p>
319 </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>
320 </li></ul></div></div></div><div id="method-hasListener" class="member inherited"><a href="Ext.grid.plugin.RowEditing.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.RowEditing.html#" rel="method-hasListener" class="cls expand">hasListener</a>(
321 <span class="pre">String eventName</span>)
322  : Boolean</div><div class="description"><div class="short"><p>Checks to see if this object has any listeners for a specified event</p>
323 </div><div class="long"><p>Checks to see if this object has any listeners for a specified event</p>
324 <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>
325 </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>
326 </li></ul></div></div></div><div id="method-observe" class="member inherited"><a href="Ext.grid.plugin.RowEditing.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.RowEditing.html#" rel="method-observe" class="cls expand">observe</a>(
327 <span class="pre">Function c, Object listeners</span>)
328  : void</div><div class="description"><div class="short">Sets observability on the passed class constructor.
329
330 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>
331
332 <p>This makes any event fired on any instance of the passed class also fire a single event through
333 the <strong>class</strong> allowing for central handling of events on many instances at once.</p>
334
335 <p>Usage:</p>
336
337 <pre><code>Ext.util.Observable.observe(Ext.data.Connection);
338 Ext.data.Connection.on('beforerequest', function(con, options) {
339     console.log('Ajax request made to ' + options.url);
340 });
341 </code></pre>
342 <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>
343 </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.RowEditing.html#addListener" rel="Ext.grid.plugin.RowEditing#addListener" class="docClass">addListener</a>.</p>
344 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
345 </li></ul></div></div></div><div id="method-on" class="member inherited"><a href="Ext.grid.plugin.RowEditing.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.RowEditing.html#" rel="method-on" class="cls expand">on</a>(
346 <span class="pre">String eventName, Function handler, [Object scope], [Object options]</span>)
347  : void</div><div class="description"><div class="short"><p>Appends an event handler to this object (shorthand for <a href="Ext.grid.plugin.RowEditing.html#addListener" rel="Ext.grid.plugin.RowEditing#addListener" class="docClass">addListener</a>.)</p>
348 </div><div class="long"><p>Appends an event handler to this object (shorthand for <a href="Ext.grid.plugin.RowEditing.html#addListener" rel="Ext.grid.plugin.RowEditing#addListener" class="docClass">addListener</a>.)</p>
349 <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>
350 </div></li><li><span class="pre">handler</span> : Function<div class="sub-desc"><p>The method the event invokes</p>
351 </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.
352 <b>If omitted, defaults to the object which fired the event.</b></p>
353 </div></li><li><span class="pre">options</span> : Object<div class="sub-desc"><p>(optional) An object containing handler configuration.</p>
354 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
355 </li></ul></div></div></div><div id="method-relayEvents" class="member inherited"><a href="Ext.grid.plugin.RowEditing.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.RowEditing.html#" rel="method-relayEvents" class="cls expand">relayEvents</a>(
356 <span class="pre">Object origin, Array events, Object prefix</span>)
357  : 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>
358 </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>
359 <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>
360 </div></li><li><span class="pre">events</span> : Array<div class="sub-desc"><p>Array of event names to relay.</p>
361 </div></li><li><span class="pre">prefix</span> : Object<div class="sub-desc">
362 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
363 </li></ul></div></div></div><div id="method-releaseCapture" class="member inherited"><a href="Ext.grid.plugin.RowEditing.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.RowEditing.html#" rel="method-releaseCapture" class="cls expand">releaseCapture</a>(
364 <span class="pre">Observable o</span>)
365  : void</div><div class="description"><div class="short"><p>Removes <b>all</b> added captures from the Observable.</p>
366 </div><div class="long"><p>Removes <b>all</b> added captures from the Observable.</p>
367 <h3 class="pa">Parameters</h3><ul><li><span class="pre">o</span> : Observable<div class="sub-desc"><p>The Observable to release</p>
368 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
369 </li></ul></div></div></div><div id="method-removeListener" class="member inherited"><a href="Ext.grid.plugin.RowEditing.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.RowEditing.html#" rel="method-removeListener" class="cls expand">removeListener</a>(
370 <span class="pre">String eventName, Function handler, [Object scope]</span>)
371  : void</div><div class="description"><div class="short"><p>Removes an event handler.</p>
372 </div><div class="long"><p>Removes an event handler.</p>
373 <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>
374 </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.RowEditing.html#addListener" rel="Ext.grid.plugin.RowEditing#addListener" class="docClass">addListener</a> call.</b></p>
375 </div></li><li><span class="pre">scope</span> : Object<div class="sub-desc"><p>(optional) The scope originally specified for the handler.</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-removeManagedListener" class="member inherited"><a href="Ext.grid.plugin.RowEditing.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.RowEditing.html#" rel="method-removeManagedListener" class="cls expand">removeManagedListener</a>(
378 <span class="pre">Observable|Element item, Object|String ename, Function fn, Object scope</span>)
379  : void</div><div class="description"><div class="short"><p>Removes listeners that were added by the <a href="Ext.grid.plugin.RowEditing.html#mon" rel="Ext.grid.plugin.RowEditing#mon" class="docClass">mon</a> method.</p>
380 </div><div class="long"><p>Removes listeners that were added by the <a href="Ext.grid.plugin.RowEditing.html#mon" rel="Ext.grid.plugin.RowEditing#mon" class="docClass">mon</a> method.</p>
381 <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>
382 </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>
383 </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
384 is the handler function.</p>
385 </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
386 is the scope (<code>this</code> reference) in which the handler function is executed.</p>
387 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
388 </li></ul></div></div></div><div id="method-resumeEvents" class="member inherited"><a href="Ext.grid.plugin.RowEditing.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.RowEditing.html#" rel="method-resumeEvents" class="cls expand">resumeEvents</a> : void</div><div class="description"><div class="short">Resume firing events. (see suspendEvents)
389 If events were suspended using the queueSuspended parameter, then all
390 event...</div><div class="long"><p>Resume firing events. (see <a href="Ext.grid.plugin.RowEditing.html#suspendEvents" rel="Ext.grid.plugin.RowEditing#suspendEvents" class="docClass">suspendEvents</a>)
391 If events were suspended using the <code><b>queueSuspended</b></code> parameter, then all
392 events fired during event suspension will be sent to any listeners now.</p>
393 <h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
394 </li></ul></div></div></div><div id="method-startEdit" class="member ni"><a href="Ext.grid.plugin.RowEditing.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.RowEditing.html" class="definedIn docClass">Ext.grid.plugin.RowEditing</a><br/><a href="../source/RowEditing.html#Ext-grid.plugin.RowEditing-method-startEdit" class="viewSource">view source</a></div><a name="startEdit"></a><a name="method-startEdit"></a><a href="Ext.grid.plugin.RowEditing.html#" rel="method-startEdit" class="cls expand">startEdit</a>(
395 <span class="pre">Model record, Model columnHeader</span>)
396  : 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>
397 </div><div class="long"><p>Start editing the specified record, using the specified Column definition to define which field is being edited.</p>
398 <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>
399 </div></li><li><span class="pre">columnHeader</span> : Model<div class="sub-desc"><p>The Column object defining the column to be edited.
400 @override</p>
401 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
402 </li></ul></div></div></div><div id="method-suspendEvents" class="member inherited"><a href="Ext.grid.plugin.RowEditing.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.RowEditing.html#" rel="method-suspendEvents" class="cls expand">suspendEvents</a>(
403 <span class="pre">Boolean queueSuspended</span>)
404  : void</div><div class="description"><div class="short"><p>Suspend the firing of all events. (see <a href="Ext.grid.plugin.RowEditing.html#resumeEvents" rel="Ext.grid.plugin.RowEditing#resumeEvents" class="docClass">resumeEvents</a>)</p>
405 </div><div class="long"><p>Suspend the firing of all events. (see <a href="Ext.grid.plugin.RowEditing.html#resumeEvents" rel="Ext.grid.plugin.RowEditing#resumeEvents" class="docClass">resumeEvents</a>)</p>
406 <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
407 after the <a href="Ext.grid.plugin.RowEditing.html#resumeEvents" rel="Ext.grid.plugin.RowEditing#resumeEvents" class="docClass">resumeEvents</a> call instead of discarding all suspended events;</p>
408 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
409 </li></ul></div></div></div><div id="method-un" class="member inherited"><a href="Ext.grid.plugin.RowEditing.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.RowEditing.html#" rel="method-un" class="cls expand">un</a>(
410 <span class="pre">String eventName, Function handler, [Object scope]</span>)
411  : void</div><div class="description"><div class="short"><p>Removes an event handler (shorthand for <a href="Ext.grid.plugin.RowEditing.html#removeListener" rel="Ext.grid.plugin.RowEditing#removeListener" class="docClass">removeListener</a>.)</p>
412 </div><div class="long"><p>Removes an event handler (shorthand for <a href="Ext.grid.plugin.RowEditing.html#removeListener" rel="Ext.grid.plugin.RowEditing#removeListener" class="docClass">removeListener</a>.)</p>
413 <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>
414 </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.RowEditing.html#addListener" rel="Ext.grid.plugin.RowEditing#addListener" class="docClass">addListener</a> call.</b></p>
415 </div></li><li><span class="pre">scope</span> : Object<div class="sub-desc"><p>(optional) The scope originally specified for the handler.</p>
416 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
417 </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.RowEditing.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.RowEditing.html" class="definedIn docClass">Ext.grid.plugin.RowEditing</a><br/><a href="../source/RowEditing.html#Ext-grid.plugin.RowEditing-event-beforeedit" class="viewSource">view source</a></div><a name="beforeedit"></a><a name="event-beforeedit"></a><a href="Ext.grid.plugin.RowEditing.html#" rel="event-beforeedit" class="cls expand">beforeedit</a>(
418 <span class="pre">Ext.grid.plugin.Editing editor, Object e</span>)
419 </div><div class="description"><div class="short">Fires before row editing is triggered. The edit event object has the following properties 
420
421
422 grid - The grid this edi...</div><div class="long"><p>Fires before row editing is triggered. The edit event object has the following properties <br /></p>
423
424 <ul style="padding:5px;padding-left:16px;">
425 <li>grid - The grid this editor is on</li>
426 <li>view - The grid view</li>
427 <li>store - The grid store</li>
428 <li>record - The record being edited</li>
429 <li>row - The grid table row</li>
430 <li>column - The grid <a href="Ext.grid.column.Column.html" rel="Ext.grid.column.Column" class="docClass">Column</a> defining the column that initiated the edit</li>
431 <li>rowIdx - The row index that is being edited</li>
432 <li>colIdx - The column index that initiated the edit</li>
433 <li>cancel - Set this to true to cancel the edit or return false from your handler.</li>
434 </ul>
435
436 <h3 class="pa">Parameters</h3><ul><li><span class="pre">editor</span> : Ext.grid.plugin.Editing<div class="sub-desc">
437 </div></li><li><span class="pre">e</span> : Object<div class="sub-desc"><p>An edit event (see above for description)</p>
438 </div></li></ul></div></div></div><div id="event-edit" class="member ni"><a href="Ext.grid.plugin.RowEditing.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.RowEditing.html" class="definedIn docClass">Ext.grid.plugin.RowEditing</a><br/><a href="../source/RowEditing.html#Ext-grid.plugin.RowEditing-event-edit" class="viewSource">view source</a></div><a name="edit"></a><a name="event-edit"></a><a href="Ext.grid.plugin.RowEditing.html#" rel="event-edit" class="cls expand">edit</a>(
439 <span class="pre">Ext.grid.plugin.Editing editor, Object e</span>)
440 </div><div class="description"><div class="short">Fires after a row is edited. The edit event object has the following properties 
441
442
443 grid - The grid this editor is on
444 ...</div><div class="long"><p>Fires after a row is edited. The edit event object has the following properties <br /></p>
445
446 <ul style="padding:5px;padding-left:16px;">
447 <li>grid - The grid this editor is on</li>
448 <li>view - The grid view</li>
449 <li>store - The grid store</li>
450 <li>record - The record being edited</li>
451 <li>row - The grid table row</li>
452 <li>column - The grid <a href="Ext.grid.column.Column.html" rel="Ext.grid.column.Column" class="docClass">Column</a> defining the column that initiated the edit</li>
453 <li>rowIdx - The row index that is being edited</li>
454 <li>colIdx - The column index that initiated the edit</li>
455 </ul>
456
457
458
459
460 <pre><code>grid.on('edit', onEdit, this);
461
462 function onEdit(e) {
463     // execute an XHR to send/commit data to the server, in callback do (if successful):
464     e.record.commit();
465 };
466 </code></pre>
467
468 <h3 class="pa">Parameters</h3><ul><li><span class="pre">editor</span> : Ext.grid.plugin.Editing<div class="sub-desc">
469 </div></li><li><span class="pre">e</span> : Object<div class="sub-desc"><p>An edit event (see above for description)</p>
470 </div></li></ul></div></div></div><div id="event-validateedit" class="member ni"><a href="Ext.grid.plugin.RowEditing.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.RowEditing.html" class="definedIn docClass">Ext.grid.plugin.RowEditing</a><br/><a href="../source/RowEditing.html#Ext-grid.plugin.RowEditing-event-validateedit" class="viewSource">view source</a></div><a name="validateedit"></a><a name="event-validateedit"></a><a href="Ext.grid.plugin.RowEditing.html#" rel="event-validateedit" class="cls expand">validateedit</a>(
471 <span class="pre">Ext.grid.plugin.Editing editor, Object e</span>)
472 </div><div class="description"><div class="short">Fires after a cell is edited, but before the value is set in the record. Return false
473 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
474 to cancel the change. The edit event object has the following properties <br /></p>
475
476 <ul style="padding:5px;padding-left:16px;">
477 <li>grid - The grid this editor is on</li>
478 <li>view - The grid view</li>
479 <li>store - The grid store</li>
480 <li>record - The record being edited</li>
481 <li>row - The grid table row</li>
482 <li>column - The grid <a href="Ext.grid.column.Column.html" rel="Ext.grid.column.Column" class="docClass">Column</a> defining the column that initiated the edit</li>
483 <li>rowIdx - The row index that is being edited</li>
484 <li>colIdx - The column index that initiated the edit</li>
485 <li>cancel - Set this to true to cancel the edit or return false from your handler.</li>
486 </ul>
487
488
489 <p>Usage example showing how to remove the red triangle (dirty record indicator) from some
490 records (not all).  By observing the grid's validateedit event, it can be cancelled if
491 the edit occurs on a targeted row (for example) and then setting the field's new value
492 in the Record directly:</p>
493
494 <pre><code>grid.on('validateedit', function(e) {
495   var myTargetRow = 6;
496
497   if (e.rowIdx == myTargetRow) {
498     e.cancel = true;
499     e.record.data[e.field] = e.value;
500   }
501 });
502 </code></pre>
503
504 <h3 class="pa">Parameters</h3><ul><li><span class="pre">editor</span> : Ext.grid.plugin.Editing<div class="sub-desc">
505 </div></li><li><span class="pre">e</span> : Object<div class="sub-desc"><p>An edit event (see above for description)</p>
506 </div></li></ul></div></div></div></div></div></div></div><div id="pageContent"></div></div></div></div></body></html>