Upgrade to ExtJS 4.0.7 - Released 10/19/2011
[extjs.git] / docs / source / DirectLoad.html
1 <!DOCTYPE html>
2 <html>
3 <head>
4   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
5   <title>The source code</title>
6   <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
7   <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
8   <style type="text/css">
9     .highlight { display: block; background-color: #ddd; }
10   </style>
11   <script type="text/javascript">
12     function highlight() {
13       document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
14     }
15   </script>
16 </head>
17 <body onload="prettyPrint(); highlight();">
18   <pre class="prettyprint lang-js"><span id='Ext-form-action-DirectLoad'>/**
19 </span> * @class Ext.form.action.DirectLoad
20  * @extends Ext.form.action.Load
21  * &lt;p&gt;Provides {@link Ext.direct.Manager} support for loading form data.&lt;/p&gt;
22  * &lt;p&gt;This example illustrates usage of Ext.direct.Direct to &lt;b&gt;load&lt;/b&gt; a form through Ext.Direct.&lt;/p&gt;
23  * &lt;pre&gt;&lt;code&gt;
24 var myFormPanel = new Ext.form.Panel({
25     // configs for FormPanel
26     title: 'Basic Information',
27     renderTo: document.body,
28     width: 300, height: 160,
29     padding: 10,
30
31     // configs apply to child items
32     defaults: {anchor: '100%'},
33     defaultType: 'textfield',
34     items: [{
35         fieldLabel: 'Name',
36         name: 'name'
37     },{
38         fieldLabel: 'Email',
39         name: 'email'
40     },{
41         fieldLabel: 'Company',
42         name: 'company'
43     }],
44
45     // configs for BasicForm
46     api: {
47         // The server-side method to call for load() requests
48         load: Profile.getBasicInfo,
49         // The server-side must mark the submit handler as a 'formHandler'
50         submit: Profile.updateBasicInfo
51     },
52     // specify the order for the passed params
53     paramOrder: ['uid', 'foo']
54 });
55
56 // load the form
57 myFormPanel.getForm().load({
58     // pass 2 arguments to server side getBasicInfo method (len=2)
59     params: {
60         foo: 'bar',
61         uid: 34
62     }
63 });
64  * &lt;/code&gt;&lt;/pre&gt;
65  * The data packet sent to the server will resemble something like:
66  * &lt;pre&gt;&lt;code&gt;
67 [
68     {
69         &quot;action&quot;:&quot;Profile&quot;,&quot;method&quot;:&quot;getBasicInfo&quot;,&quot;type&quot;:&quot;rpc&quot;,&quot;tid&quot;:2,
70         &quot;data&quot;:[34,&quot;bar&quot;] // note the order of the params
71     }
72 ]
73  * &lt;/code&gt;&lt;/pre&gt;
74  * The form will process a data packet returned by the server that is similar
75  * to the following format:
76  * &lt;pre&gt;&lt;code&gt;
77 [
78     {
79         &quot;action&quot;:&quot;Profile&quot;,&quot;method&quot;:&quot;getBasicInfo&quot;,&quot;type&quot;:&quot;rpc&quot;,&quot;tid&quot;:2,
80         &quot;result&quot;:{
81             &quot;success&quot;:true,
82             &quot;data&quot;:{
83                 &quot;name&quot;:&quot;Fred Flintstone&quot;,
84                 &quot;company&quot;:&quot;Slate Rock and Gravel&quot;,
85                 &quot;email&quot;:&quot;fred.flintstone@slaterg.com&quot;
86             }
87         }
88     }
89 ]
90  * &lt;/code&gt;&lt;/pre&gt;
91  */
92 Ext.define('Ext.form.action.DirectLoad', {
93     extend:'Ext.form.action.Load',
94     requires: ['Ext.direct.Manager'],
95     alternateClassName: 'Ext.form.Action.DirectLoad',
96     alias: 'formaction.directload',
97
98     type: 'directload',
99
100     run: function() {
101         this.form.api.load.apply(window, this.getArgs());
102     },
103
104 <span id='Ext-form-action-DirectLoad-method-getArgs'>    /**
105 </span>     * @private
106      * Build the arguments to be sent to the Direct call.
107      * @return Array
108      */
109     getArgs: function() {
110         var me = this,
111             args = [],
112             form = me.form,
113             paramOrder = form.paramOrder,
114             params = me.getParams(),
115             i, len;
116
117         // If a paramOrder was specified, add the params into the argument list in that order.
118         if (paramOrder) {
119             for (i = 0, len = paramOrder.length; i &lt; len; i++) {
120                 args.push(params[paramOrder[i]]);
121             }
122         }
123         // If paramsAsHash was specified, add all the params as a single object argument.
124         else if (form.paramsAsHash) {
125             args.push(params);
126         }
127
128         // Add the callback and scope to the end of the arguments list
129         args.push(me.onSuccess, me);
130
131         return args;
132     },
133
134     // Direct actions have already been processed and therefore
135     // we can directly set the result; Direct Actions do not have
136     // a this.response property.
137     processResponse: function(result) {
138         return (this.result = result);
139     },
140
141     onSuccess: function(result, trans) {
142         if (trans.type == Ext.direct.Manager.self.exceptions.SERVER) {
143             result = {};
144         }
145         this.callParent([result]);
146     }
147 });
148
149
150 </pre>
151 </body>
152 </html>