Upgrade to ExtJS 3.1.1 - Released 02/08/2010
[extjs.git] / docs / source / Action.html
1 <html>\r
2 <head>\r
3   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    \r
4   <title>The source code</title>\r
5     <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
6     <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
7 </head>\r
8 <body  onload="prettyPrint();">\r
9     <pre class="prettyprint lang-js"><div id="cls-Ext.form.Action"></div>/**
10  * @class Ext.form.Action
11  * <p>The subclasses of this class provide actions to perform upon {@link Ext.form.BasicForm Form}s.</p>
12  * <p>Instances of this class are only created by a {@link Ext.form.BasicForm Form} when
13  * the Form needs to perform an action such as submit or load. The Configuration options
14  * listed for this class are set through the Form's action methods: {@link Ext.form.BasicForm#submit submit},
15  * {@link Ext.form.BasicForm#load load} and {@link Ext.form.BasicForm#doAction doAction}</p>
16  * <p>The instance of Action which performed the action is passed to the success
17  * and failure callbacks of the Form's action methods ({@link Ext.form.BasicForm#submit submit},
18  * {@link Ext.form.BasicForm#load load} and {@link Ext.form.BasicForm#doAction doAction}),
19  * and to the {@link Ext.form.BasicForm#actioncomplete actioncomplete} and
20  * {@link Ext.form.BasicForm#actionfailed actionfailed} event handlers.</p>
21  */
22 Ext.form.Action = function(form, options){
23     this.form = form;
24     this.options = options || {};
25 };
26
27 <div id="prop-Ext.form.Action-CLIENT_INVALID"></div>/**
28  * Failure type returned when client side validation of the Form fails
29  * thus aborting a submit action. Client side validation is performed unless
30  * {@link #clientValidation} is explicitly set to <tt>false</tt>.
31  * @type {String}
32  * @static
33  */
34 Ext.form.Action.CLIENT_INVALID = 'client';
35 <div id="prop-Ext.form.Action-SERVER_INVALID"></div>/**
36  * <p>Failure type returned when server side processing fails and the {@link #result}'s
37  * <tt style="font-weight:bold">success</tt> property is set to <tt>false</tt>.</p>
38  * <p>In the case of a form submission, field-specific error messages may be returned in the
39  * {@link #result}'s <tt style="font-weight:bold">errors</tt> property.</p>
40  * @type {String}
41  * @static
42  */
43 Ext.form.Action.SERVER_INVALID = 'server';
44 <div id="prop-Ext.form.Action-CONNECT_FAILURE"></div>/**
45  * Failure type returned when a communication error happens when attempting
46  * to send a request to the remote server. The {@link #response} may be examined to
47  * provide further information.
48  * @type {String}
49  * @static
50  */
51 Ext.form.Action.CONNECT_FAILURE = 'connect';
52 <div id="prop-Ext.form.Action-LOAD_FAILURE"></div>/**
53  * Failure type returned when the response's <tt style="font-weight:bold">success</tt>
54  * property is set to <tt>false</tt>, or no field values are returned in the response's
55  * <tt style="font-weight:bold">data</tt> property.
56  * @type {String}
57  * @static
58  */
59 Ext.form.Action.LOAD_FAILURE = 'load';
60
61 Ext.form.Action.prototype = {
62 <div id="cfg-Ext.form.Action-url"></div>/**
63  * @cfg {String} url The URL that the Action is to invoke.
64  */
65 <div id="cfg-Ext.form.Action-reset"></div>/**
66  * @cfg {Boolean} reset When set to <tt><b>true</b></tt>, causes the Form to be
67  * {@link Ext.form.BasicForm.reset reset} on Action success. If specified, this happens
68  * <b>before</b> the {@link #success} callback is called and before the Form's
69  * {@link Ext.form.BasicForm.actioncomplete actioncomplete} event fires.
70  */
71 <div id="cfg-Ext.form.Action-method"></div>/**
72  * @cfg {String} method The HTTP method to use to access the requested URL. Defaults to the
73  * {@link Ext.form.BasicForm}'s method, or if that is not specified, the underlying DOM form's method.
74  */
75 <div id="cfg-Ext.form.Action-params"></div>/**
76  * @cfg {Mixed} params <p>Extra parameter values to pass. These are added to the Form's
77  * {@link Ext.form.BasicForm#baseParams} and passed to the specified URL along with the Form's
78  * input fields.</p>
79  * <p>Parameters are encoded as standard HTTP parameters using {@link Ext#urlEncode}.</p>
80  */
81 <div id="cfg-Ext.form.Action-timeout"></div>/**
82  * @cfg {Number} timeout The number of seconds to wait for a server response before
83  * failing with the {@link #failureType} as {@link #Action.CONNECT_FAILURE}. If not specified,
84  * defaults to the configured <tt>{@link Ext.form.BasicForm#timeout timeout}</tt> of the
85  * {@link Ext.form.BasicForm form}.
86  */
87 <div id="cfg-Ext.form.Action-success"></div>/**
88  * @cfg {Function} success The function to call when a valid success return packet is recieved.
89  * The function is passed the following parameters:<ul class="mdetail-params">
90  * <li><b>form</b> : Ext.form.BasicForm<div class="sub-desc">The form that requested the action</div></li>
91  * <li><b>action</b> : Ext.form.Action<div class="sub-desc">The Action class. The {@link #result}
92  * property of this object may be examined to perform custom postprocessing.</div></li>
93  * </ul>
94  */
95 <div id="cfg-Ext.form.Action-failure"></div>/**
96  * @cfg {Function} failure The function to call when a failure packet was recieved, or when an
97  * error ocurred in the Ajax communication.
98  * The function is passed the following parameters:<ul class="mdetail-params">
99  * <li><b>form</b> : Ext.form.BasicForm<div class="sub-desc">The form that requested the action</div></li>
100  * <li><b>action</b> : Ext.form.Action<div class="sub-desc">The Action class. If an Ajax
101  * error ocurred, the failure type will be in {@link #failureType}. The {@link #result}
102  * property of this object may be examined to perform custom postprocessing.</div></li>
103  * </ul>
104  */
105 <div id="cfg-Ext.form.Action-scope"></div>/**
106  * @cfg {Object} scope The scope in which to call the callback functions (The <tt>this</tt> reference
107  * for the callback functions).
108  */
109 <div id="cfg-Ext.form.Action-waitMsg"></div>/**
110  * @cfg {String} waitMsg The message to be displayed by a call to {@link Ext.MessageBox#wait}
111  * during the time the action is being processed.
112  */
113 <div id="cfg-Ext.form.Action-waitTitle"></div>/**
114  * @cfg {String} waitTitle The title to be displayed by a call to {@link Ext.MessageBox#wait}
115  * during the time the action is being processed.
116  */
117
118 <div id="prop-Ext.form.Action-type"></div>/**
119  * The type of action this Action instance performs.
120  * Currently only "submit" and "load" are supported.
121  * @type {String}
122  */
123     type : 'default',
124 <div id="prop-Ext.form.Action-failureType"></div>/**
125  * The type of failure detected will be one of these: {@link #CLIENT_INVALID},
126  * {@link #SERVER_INVALID}, {@link #CONNECT_FAILURE}, or {@link #LOAD_FAILURE}.  Usage:
127  * <pre><code>
128 var fp = new Ext.form.FormPanel({
129 ...
130 buttons: [{
131     text: 'Save',
132     formBind: true,
133     handler: function(){
134         if(fp.getForm().isValid()){
135             fp.getForm().submit({
136                 url: 'form-submit.php',
137                 waitMsg: 'Submitting your data...',
138                 success: function(form, action){
139                     // server responded with success = true
140                     var result = action.{@link #result};
141                 },
142                 failure: function(form, action){
143                     if (action.{@link #failureType} === Ext.form.Action.{@link #CONNECT_FAILURE}) {
144                         Ext.Msg.alert('Error',
145                             'Status:'+action.{@link #response}.status+': '+
146                             action.{@link #response}.statusText);
147                     }
148                     if (action.failureType === Ext.form.Action.{@link #SERVER_INVALID}){
149                         // server responded with success = false
150                         Ext.Msg.alert('Invalid', action.{@link #result}.errormsg);
151                     }
152                 }
153             });
154         }
155     }
156 },{
157     text: 'Reset',
158     handler: function(){
159         fp.getForm().reset();
160     }
161 }]
162  * </code></pre>
163  * @property failureType
164  * @type {String}
165  */
166  <div id="prop-Ext.form.Action-response"></div>/**
167  * The XMLHttpRequest object used to perform the action.
168  * @property response
169  * @type {Object}
170  */
171  <div id="prop-Ext.form.Action-result"></div>/**
172  * The decoded response object containing a boolean <tt style="font-weight:bold">success</tt> property and
173  * other, action-specific properties.
174  * @property result
175  * @type {Object}
176  */
177
178     // interface method
179     run : function(options){
180
181     },
182
183     // interface method
184     success : function(response){
185
186     },
187
188     // interface method
189     handleResponse : function(response){
190
191     },
192
193     // default connection failure
194     failure : function(response){
195         this.response = response;
196         this.failureType = Ext.form.Action.CONNECT_FAILURE;
197         this.form.afterAction(this, false);
198     },
199
200     // private
201     // shared code among all Actions to validate that there was a response
202     // with either responseText or responseXml
203     processResponse : function(response){
204         this.response = response;
205         if(!response.responseText && !response.responseXML){
206             return true;
207         }
208         this.result = this.handleResponse(response);
209         return this.result;
210     },
211
212     // utility functions used internally
213     getUrl : function(appendParams){
214         var url = this.options.url || this.form.url || this.form.el.dom.action;
215         if(appendParams){
216             var p = this.getParams();
217             if(p){
218                 url = Ext.urlAppend(url, p);
219             }
220         }
221         return url;
222     },
223
224     // private
225     getMethod : function(){
226         return (this.options.method || this.form.method || this.form.el.dom.method || 'POST').toUpperCase();
227     },
228
229     // private
230     getParams : function(){
231         var bp = this.form.baseParams;
232         var p = this.options.params;
233         if(p){
234             if(typeof p == "object"){
235                 p = Ext.urlEncode(Ext.applyIf(p, bp));
236             }else if(typeof p == 'string' && bp){
237                 p += '&' + Ext.urlEncode(bp);
238             }
239         }else if(bp){
240             p = Ext.urlEncode(bp);
241         }
242         return p;
243     },
244
245     // private
246     createCallback : function(opts){
247         var opts = opts || {};
248         return {
249             success: this.success,
250             failure: this.failure,
251             scope: this,
252             timeout: (opts.timeout*1000) || (this.form.timeout*1000),
253             upload: this.form.fileUpload ? this.success : undefined
254         };
255     }
256 };
257
258 <div id="cls-Ext.form.Action.Submit"></div>/**
259  * @class Ext.form.Action.Submit
260  * @extends Ext.form.Action
261  * <p>A class which handles submission of data from {@link Ext.form.BasicForm Form}s
262  * and processes the returned response.</p>
263  * <p>Instances of this class are only created by a {@link Ext.form.BasicForm Form} when
264  * {@link Ext.form.BasicForm#submit submit}ting.</p>
265  * <p><u><b>Response Packet Criteria</b></u></p>
266  * <p>A response packet may contain:
267  * <div class="mdetail-params"><ul>
268  * <li><b><code>success</code></b> property : Boolean
269  * <div class="sub-desc">The <code>success</code> property is required.</div></li>
270  * <li><b><code>errors</code></b> property : Object
271  * <div class="sub-desc"><div class="sub-desc">The <code>errors</code> property,
272  * which is optional, contains error messages for invalid fields.</div></li>
273  * </ul></div>
274  * <p><u><b>JSON Packets</b></u></p>
275  * <p>By default, response packets are assumed to be JSON, so a typical response
276  * packet may look like this:</p><pre><code>
277 {
278     success: false,
279     errors: {
280         clientCode: "Client not found",
281         portOfLoading: "This field must not be null"
282     }
283 }</code></pre>
284  * <p>Other data may be placed into the response for processing by the {@link Ext.form.BasicForm}'s callback
285  * or event handler methods. The object decoded from this JSON is available in the
286  * {@link Ext.form.Action#result result} property.</p>
287  * <p>Alternatively, if an {@link #errorReader} is specified as an {@link Ext.data.XmlReader XmlReader}:</p><pre><code>
288     errorReader: new Ext.data.XmlReader({
289             record : 'field',
290             success: '@success'
291         }, [
292             'id', 'msg'
293         ]
294     )
295 </code></pre>
296  * <p>then the results may be sent back in XML format:</p><pre><code>
297 &lt;?xml version="1.0" encoding="UTF-8"?&gt;
298 &lt;message success="false"&gt;
299 &lt;errors&gt;
300     &lt;field&gt;
301         &lt;id&gt;clientCode&lt;/id&gt;
302         &lt;msg&gt;&lt;![CDATA[Code not found. &lt;br /&gt;&lt;i&gt;This is a test validation message from the server &lt;/i&gt;]]&gt;&lt;/msg&gt;
303     &lt;/field&gt;
304     &lt;field&gt;
305         &lt;id&gt;portOfLoading&lt;/id&gt;
306         &lt;msg&gt;&lt;![CDATA[Port not found. &lt;br /&gt;&lt;i&gt;This is a test validation message from the server &lt;/i&gt;]]&gt;&lt;/msg&gt;
307     &lt;/field&gt;
308 &lt;/errors&gt;
309 &lt;/message&gt;
310 </code></pre>
311  * <p>Other elements may be placed into the response XML for processing by the {@link Ext.form.BasicForm}'s callback
312  * or event handler methods. The XML document is available in the {@link #errorReader}'s {@link Ext.data.XmlReader#xmlData xmlData} property.</p>
313  */
314 Ext.form.Action.Submit = function(form, options){
315     Ext.form.Action.Submit.superclass.constructor.call(this, form, options);
316 };
317
318 Ext.extend(Ext.form.Action.Submit, Ext.form.Action, {
319     <div id="cfg-Ext.form.Action.Submit-errorReader"></div>/**
320      * @cfg {Ext.data.DataReader} errorReader <p><b>Optional. JSON is interpreted with
321      * no need for an errorReader.</b></p>
322      * <p>A Reader which reads a single record from the returned data. The DataReader's
323      * <b>success</b> property specifies how submission success is determined. The Record's
324      * data provides the error messages to apply to any invalid form Fields.</p>
325      */
326     <div id="cfg-Ext.form.Action.Submit-clientValidation"></div>/**
327      * @cfg {boolean} clientValidation Determines whether a Form's fields are validated
328      * in a final call to {@link Ext.form.BasicForm#isValid isValid} prior to submission.
329      * Pass <tt>false</tt> in the Form's submit options to prevent this. If not defined, pre-submission field validation
330      * is performed.
331      */
332     type : 'submit',
333
334     // private
335     run : function(){
336         var o = this.options;
337         var method = this.getMethod();
338         var isGet = method == 'GET';
339         if(o.clientValidation === false || this.form.isValid()){
340             Ext.Ajax.request(Ext.apply(this.createCallback(o), {
341                 form:this.form.el.dom,
342                 url:this.getUrl(isGet),
343                 method: method,
344                 headers: o.headers,
345                 params:!isGet ? this.getParams() : null,
346                 isUpload: this.form.fileUpload
347             }));
348         }else if (o.clientValidation !== false){ // client validation failed
349             this.failureType = Ext.form.Action.CLIENT_INVALID;
350             this.form.afterAction(this, false);
351         }
352     },
353
354     // private
355     success : function(response){
356         var result = this.processResponse(response);
357         if(result === true || result.success){
358             this.form.afterAction(this, true);
359             return;
360         }
361         if(result.errors){
362             this.form.markInvalid(result.errors);
363         }
364         this.failureType = Ext.form.Action.SERVER_INVALID;
365         this.form.afterAction(this, false);
366     },
367
368     // private
369     handleResponse : function(response){
370         if(this.form.errorReader){
371             var rs = this.form.errorReader.read(response);
372             var errors = [];
373             if(rs.records){
374                 for(var i = 0, len = rs.records.length; i < len; i++) {
375                     var r = rs.records[i];
376                     errors[i] = r.data;
377                 }
378             }
379             if(errors.length < 1){
380                 errors = null;
381             }
382             return {
383                 success : rs.success,
384                 errors : errors
385             };
386         }
387         return Ext.decode(response.responseText);
388     }
389 });
390
391
392 <div id="cls-Ext.form.Action.Load"></div>/**
393  * @class Ext.form.Action.Load
394  * @extends Ext.form.Action
395  * <p>A class which handles loading of data from a server into the Fields of an {@link Ext.form.BasicForm}.</p>
396  * <p>Instances of this class are only created by a {@link Ext.form.BasicForm Form} when
397  * {@link Ext.form.BasicForm#load load}ing.</p>
398  * <p><u><b>Response Packet Criteria</b></u></p>
399  * <p>A response packet <b>must</b> contain:
400  * <div class="mdetail-params"><ul>
401  * <li><b><code>success</code></b> property : Boolean</li>
402  * <li><b><code>data</code></b> property : Object</li>
403  * <div class="sub-desc">The <code>data</code> property contains the values of Fields to load.
404  * The individual value object for each Field is passed to the Field's
405  * {@link Ext.form.Field#setValue setValue} method.</div></li>
406  * </ul></div>
407  * <p><u><b>JSON Packets</b></u></p>
408  * <p>By default, response packets are assumed to be JSON, so for the following form load call:<pre><code>
409 var myFormPanel = new Ext.form.FormPanel({
410     title: 'Client and routing info',
411     items: [{
412         fieldLabel: 'Client',
413         name: 'clientName'
414     }, {
415         fieldLabel: 'Port of loading',
416         name: 'portOfLoading'
417     }, {
418         fieldLabel: 'Port of discharge',
419         name: 'portOfDischarge'
420     }]
421 });
422 myFormPanel.{@link Ext.form.FormPanel#getForm getForm}().{@link Ext.form.BasicForm#load load}({
423     url: '/getRoutingInfo.php',
424     params: {
425         consignmentRef: myConsignmentRef
426     },
427     failure: function(form, action) {
428         Ext.Msg.alert("Load failed", action.result.errorMessage);
429     }
430 });
431 </code></pre>
432  * a <b>success response</b> packet may look like this:</p><pre><code>
433 {
434     success: true,
435     data: {
436         clientName: "Fred. Olsen Lines",
437         portOfLoading: "FXT",
438         portOfDischarge: "OSL"
439     }
440 }</code></pre>
441  * while a <b>failure response</b> packet may look like this:</p><pre><code>
442 {
443     success: false,
444     errorMessage: "Consignment reference not found"
445 }</code></pre>
446  * <p>Other data may be placed into the response for processing the {@link Ext.form.BasicForm Form}'s
447  * callback or event handler methods. The object decoded from this JSON is available in the
448  * {@link Ext.form.Action#result result} property.</p>
449  */
450 Ext.form.Action.Load = function(form, options){
451     Ext.form.Action.Load.superclass.constructor.call(this, form, options);
452     this.reader = this.form.reader;
453 };
454
455 Ext.extend(Ext.form.Action.Load, Ext.form.Action, {
456     // private
457     type : 'load',
458
459     // private
460     run : function(){
461         Ext.Ajax.request(Ext.apply(
462                 this.createCallback(this.options), {
463                     method:this.getMethod(),
464                     url:this.getUrl(false),
465                     headers: this.options.headers,
466                     params:this.getParams()
467         }));
468     },
469
470     // private
471     success : function(response){
472         var result = this.processResponse(response);
473         if(result === true || !result.success || !result.data){
474             this.failureType = Ext.form.Action.LOAD_FAILURE;
475             this.form.afterAction(this, false);
476             return;
477         }
478         this.form.clearInvalid();
479         this.form.setValues(result.data);
480         this.form.afterAction(this, true);
481     },
482
483     // private
484     handleResponse : function(response){
485         if(this.form.reader){
486             var rs = this.form.reader.read(response);
487             var data = rs.records && rs.records[0] ? rs.records[0].data : null;
488             return {
489                 success : rs.success,
490                 data : data
491             };
492         }
493         return Ext.decode(response.responseText);
494     }
495 });
496
497
498
499 <div id="cls-Ext.form.Action.DirectLoad"></div>/**
500  * @class Ext.form.Action.DirectLoad
501  * @extends Ext.form.Action.Load
502  * <p>Provides Ext.direct support for loading form data.</p>
503  * <p>This example illustrates usage of Ext.Direct to <b>load</b> a form through Ext.Direct.</p>
504  * <pre><code>
505 var myFormPanel = new Ext.form.FormPanel({
506     // configs for FormPanel
507     title: 'Basic Information',
508     renderTo: document.body,
509     width: 300, height: 160,
510     padding: 10,
511
512     // configs apply to child items
513     defaults: {anchor: '100%'},
514     defaultType: 'textfield',
515     items: [{
516         fieldLabel: 'Name',
517         name: 'name'
518     },{
519         fieldLabel: 'Email',
520         name: 'email'
521     },{
522         fieldLabel: 'Company',
523         name: 'company'
524     }],
525
526     // configs for BasicForm
527     api: {
528         // The server-side method to call for load() requests
529         load: Profile.getBasicInfo,
530         // The server-side must mark the submit handler as a 'formHandler'
531         submit: Profile.updateBasicInfo
532     },
533     // specify the order for the passed params
534     paramOrder: ['uid', 'foo']
535 });
536
537 // load the form
538 myFormPanel.getForm().load({
539     // pass 2 arguments to server side getBasicInfo method (len=2)
540     params: {
541         foo: 'bar',
542         uid: 34
543     }
544 });
545  * </code></pre>
546  * The data packet sent to the server will resemble something like:
547  * <pre><code>
548 [
549     {
550         "action":"Profile","method":"getBasicInfo","type":"rpc","tid":2,
551         "data":[34,"bar"] // note the order of the params
552     }
553 ]
554  * </code></pre>
555  * The form will process a data packet returned by the server that is similar
556  * to the following format:
557  * <pre><code>
558 [
559     {
560         "action":"Profile","method":"getBasicInfo","type":"rpc","tid":2,
561         "result":{
562             "success":true,
563             "data":{
564                 "name":"Fred Flintstone",
565                 "company":"Slate Rock and Gravel",
566                 "email":"fred.flintstone@slaterg.com"
567             }
568         }
569     }
570 ]
571  * </code></pre>
572  */
573 Ext.form.Action.DirectLoad = Ext.extend(Ext.form.Action.Load, {
574     constructor: function(form, opts) {
575         Ext.form.Action.DirectLoad.superclass.constructor.call(this, form, opts);
576     },
577     type : 'directload',
578
579     run : function(){
580         var args = this.getParams();
581         args.push(this.success, this);
582         this.form.api.load.apply(window, args);
583     },
584
585     getParams : function() {
586         var buf = [], o = {};
587         var bp = this.form.baseParams;
588         var p = this.options.params;
589         Ext.apply(o, p, bp);
590         var paramOrder = this.form.paramOrder;
591         if(paramOrder){
592             for(var i = 0, len = paramOrder.length; i < len; i++){
593                 buf.push(o[paramOrder[i]]);
594             }
595         }else if(this.form.paramsAsHash){
596             buf.push(o);
597         }
598         return buf;
599     },
600     // Direct actions have already been processed and therefore
601     // we can directly set the result; Direct Actions do not have
602     // a this.response property.
603     processResponse : function(result) {
604         this.result = result;
605         return result;
606     },
607     
608     success : function(response, trans){
609         if(trans.type == Ext.Direct.exceptions.SERVER){
610             response = {};
611         }
612         Ext.form.Action.DirectLoad.superclass.success.call(this, response);
613     }
614 });
615
616 <div id="cls-Ext.form.Action.DirectSubmit"></div>/**
617  * @class Ext.form.Action.DirectSubmit
618  * @extends Ext.form.Action.Submit
619  * <p>Provides Ext.direct support for submitting form data.</p>
620  * <p>This example illustrates usage of Ext.Direct to <b>submit</b> a form through Ext.Direct.</p>
621  * <pre><code>
622 var myFormPanel = new Ext.form.FormPanel({
623     // configs for FormPanel
624     title: 'Basic Information',
625     renderTo: document.body,
626     width: 300, height: 160,
627     padding: 10,
628     buttons:[{
629         text: 'Submit',
630         handler: function(){
631             myFormPanel.getForm().submit({
632                 params: {
633                     foo: 'bar',
634                     uid: 34
635                 }
636             });
637         }
638     }],
639
640     // configs apply to child items
641     defaults: {anchor: '100%'},
642     defaultType: 'textfield',
643     items: [{
644         fieldLabel: 'Name',
645         name: 'name'
646     },{
647         fieldLabel: 'Email',
648         name: 'email'
649     },{
650         fieldLabel: 'Company',
651         name: 'company'
652     }],
653
654     // configs for BasicForm
655     api: {
656         // The server-side method to call for load() requests
657         load: Profile.getBasicInfo,
658         // The server-side must mark the submit handler as a 'formHandler'
659         submit: Profile.updateBasicInfo
660     },
661     // specify the order for the passed params
662     paramOrder: ['uid', 'foo']
663 });
664  * </code></pre>
665  * The data packet sent to the server will resemble something like:
666  * <pre><code>
667 {
668     "action":"Profile","method":"updateBasicInfo","type":"rpc","tid":"6",
669     "result":{
670         "success":true,
671         "id":{
672             "extAction":"Profile","extMethod":"updateBasicInfo",
673             "extType":"rpc","extTID":"6","extUpload":"false",
674             "name":"Aaron Conran","email":"aaron@extjs.com","company":"Ext JS, LLC"
675         }
676     }
677 }
678  * </code></pre>
679  * The form will process a data packet returned by the server that is similar
680  * to the following:
681  * <pre><code>
682 // sample success packet (batched requests)
683 [
684     {
685         "action":"Profile","method":"updateBasicInfo","type":"rpc","tid":3,
686         "result":{
687             "success":true
688         }
689     }
690 ]
691
692 // sample failure packet (one request)
693 {
694         "action":"Profile","method":"updateBasicInfo","type":"rpc","tid":"6",
695         "result":{
696             "errors":{
697                 "email":"already taken"
698             },
699             "success":false,
700             "foo":"bar"
701         }
702 }
703  * </code></pre>
704  * Also see the discussion in {@link Ext.form.Action.DirectLoad}.
705  */
706 Ext.form.Action.DirectSubmit = Ext.extend(Ext.form.Action.Submit, {
707     constructor : function(form, opts) {
708         Ext.form.Action.DirectSubmit.superclass.constructor.call(this, form, opts);
709     },
710     type : 'directsubmit',
711     // override of Submit
712     run : function(){
713         var o = this.options;
714         if(o.clientValidation === false || this.form.isValid()){
715             // tag on any additional params to be posted in the
716             // form scope
717             this.success.params = this.getParams();
718             this.form.api.submit(this.form.el.dom, this.success, this);
719         }else if (o.clientValidation !== false){ // client validation failed
720             this.failureType = Ext.form.Action.CLIENT_INVALID;
721             this.form.afterAction(this, false);
722         }
723     },
724
725     getParams : function() {
726         var o = {};
727         var bp = this.form.baseParams;
728         var p = this.options.params;
729         Ext.apply(o, p, bp);
730         return o;
731     },
732     // Direct actions have already been processed and therefore
733     // we can directly set the result; Direct Actions do not have
734     // a this.response property.
735     processResponse : function(result) {
736         this.result = result;
737         return result;
738     },
739     
740     success : function(response, trans){
741         if(trans.type == Ext.Direct.exceptions.SERVER){
742             response = {};
743         }
744         Ext.form.Action.DirectSubmit.superclass.success.call(this, response);
745     }
746 });
747
748 Ext.form.Action.ACTION_TYPES = {
749     'load' : Ext.form.Action.Load,
750     'submit' : Ext.form.Action.Submit,
751     'directload' : Ext.form.Action.DirectLoad,
752     'directsubmit' : Ext.form.Action.DirectSubmit
753 };
754 </pre>    \r
755 </body>\r
756 </html>