~cdparra/gelee/trunk

« back to all changes in this revision

Viewing changes to webui/ecosystem/workspace/extjs/docs/source/direct-form.html

  • Committer: parra
  • Date: 2010-03-15 15:56:56 UTC
  • Revision ID: svn-v4:ac5bba68-f036-4e09-846e-8f32731cc928:trunk/gelee:1448
merged gelee at svn

Show diffs side-by-side

added added

removed removed

Lines of Context:
 
1
<html>
 
2
<head>
 
3
  <title>The source code</title>
 
4
    <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
 
5
    <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
 
6
</head>
 
7
<body  onload="prettyPrint();">
 
8
    <pre class="prettyprint lang-js">// This example illustrates how to load a FormPanel or BasicForm through Ext.Direct.
 
9
 
 
10
Ext.onReady(function(){
 
11
    // Notice that Direct requests will batch together if they occur
 
12
    // within the enableBuffer delay period (in milliseconds).
 
13
    // Slow the buffering down from the default of 10ms to 100ms
 
14
    Ext.app.REMOTING_API.enableBuffer = 100;
 
15
    Ext.Direct.addProvider(Ext.app.REMOTING_API);
 
16
    
 
17
    // provide feedback for any errors
 
18
    Ext.QuickTips.init();
 
19
    
 
20
    var basicInfo = new Ext.form.FormPanel({
 
21
        // configs for FormPanel
 
22
        title: 'Basic Information',
 
23
        border: false,
 
24
        padding: 10,
 
25
        buttons:[{
 
26
            text: 'Submit',
 
27
            handler: function(){
 
28
                basicInfo.getForm().submit({
 
29
                    params: {
 
30
                        foo: 'bar',
 
31
                        uid: 34 
 
32
                    }
 
33
                });
 
34
            }
 
35
        }],
 
36
 
 
37
        // configs apply to child items
 
38
        defaults: {anchor: '-20'}, // provide some room on right for validation errors
 
39
        defaultType: 'textfield',
 
40
        items: [{
 
41
            fieldLabel: 'Name',
 
42
            name: 'name'
 
43
        },{
 
44
            fieldLabel: 'Email',
 
45
            msgTarget: 'side',
 
46
            name: 'email'        
 
47
        },{
 
48
            fieldLabel: 'Company',
 
49
            name: 'company'
 
50
        }],
 
51
        
 
52
        // configs for BasicForm
 
53
        api: {
 
54
            // The server-side method to call for load() requests
 
55
            load: Profile.getBasicInfo,
 
56
            // The server-side must mark the submit handler as a 'formHandler'
 
57
            submit: Profile.updateBasicInfo
 
58
        },
 
59
        // specify the order for the passed params    
 
60
        paramOrder: ['uid', 'foo']
 
61
    });
 
62
    
 
63
    var phoneInfo = new Ext.form.FormPanel({
 
64
        title: 'Phone Numbers',
 
65
        border: false,
 
66
        api: {
 
67
            load: Profile.getPhoneInfo
 
68
        },    
 
69
        padding: 10,
 
70
        paramOrder: ['uid'],
 
71
        defaultType: 'textfield',
 
72
        defaults: {anchor: '100%'},
 
73
        items: [{
 
74
            fieldLabel: 'Office',
 
75
            name: 'office'
 
76
        },{
 
77
            fieldLabel: 'Cell',
 
78
            name: 'cell'        
 
79
        },{
 
80
            fieldLabel: 'Home',
 
81
            name: 'home'
 
82
        }]
 
83
    });
 
84
    
 
85
     var locationInfo = new Ext.form.FormPanel({
 
86
        title: 'Location Information',
 
87
        border: false,
 
88
        padding: 10,
 
89
        api: {
 
90
            load: Profile.getLocationInfo
 
91
        },    
 
92
        paramOrder: ['uid'],
 
93
        defaultType: 'textfield',
 
94
        defaults: {anchor: '100%'},
 
95
        items: [{
 
96
            fieldLabel: 'Street',
 
97
            name: 'street'
 
98
        },{
 
99
            fieldLabel: 'City',
 
100
            name: 'city'            
 
101
        },{
 
102
            fieldLabel: 'State',
 
103
            name: 'state'
 
104
        },{
 
105
            fieldLabel: 'Zip',
 
106
            name: 'zip'
 
107
        }]
 
108
    });    
 
109
 
 
110
     var accordion = new Ext.Panel({
 
111
        layout: 'accordion',
 
112
        renderTo: Ext.getBody(),
 
113
        title: 'My Profile',
 
114
        width: 300,
 
115
        height: 240,    
 
116
        items: [basicInfo, phoneInfo, locationInfo]
 
117
    });
 
118
        
 
119
    // load the forms (notice the load requests will get batched together)
 
120
    basicInfo.getForm().load({
 
121
        // pass 2 arguments to server side getBasicInfo method (len=2)
 
122
        params: {
 
123
            foo: 'bar',
 
124
            uid: 34 
 
125
        }
 
126
    });
 
127
 
 
128
    phoneInfo.getForm().load({
 
129
        params: {
 
130
            uid: 5
 
131
        }
 
132
    });    
 
133
 
 
134
    // defer this request just to simulate the request not getting batched
 
135
    // since it exceeds to configured buffer
 
136
    (function(){
 
137
        locationInfo.getForm().load({
 
138
            params: {
 
139
                uid: 5
 
140
            }
 
141
        });
 
142
    }).defer(200);    
 
143
    
 
144
    // rpc call
 
145
    TestAction.doEcho('sample');
 
146
 
 
147
});</pre>    
 
148
</body>
 
149
</html>
 
 
b'\\ No newline at end of file'