← Back to branch summary

~cdparra/gelee/trunk

« back to all changes in this revision

Viewing changes to webui/ecosystem/workspace/extjs/examples/multiselect/multiselect-demo.js

  • 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:
webui/ecosystem/workspace/extjs/examples/multiselect/multiselect-demo.js
 
1
/*!
 
2
 * Ext JS Library 3.0.0
 
3
 * Copyright(c) 2006-2009 Ext JS, LLC
 
4
 * licensing@extjs.com
 
5
 * http://www.extjs.com/license
 
6
 */
 
7
Ext.onReady(function(){
 
8
 
 
9
    Ext.QuickTips.init();
 
10
    Ext.form.Field.prototype.msgTarget = 'side';
 
11
 
 
12
    /*
 
13
     * Ext.ux.form.MultiSelect Example Code
 
14
     */
 
15
    var msForm = new Ext.form.FormPanel({
 
16
        title: 'MultiSelect Test',
 
17
        width: 700,
 
18
        bodyStyle: 'padding:10px;',
 
19
        renderTo: 'multiselect',
 
20
        items:[{
 
21
            xtype: 'multiselect',
 
22
            fieldLabel: 'Multiselect<br />(Required)',
 
23
            name: 'multiselect',
 
24
            width: 250,
 
25
            height: 200,
 
26
            allowBlank:false,
 
27
            store: [[123,'One Hundred Twenty Three'],
 
28
                    ['1', 'One'], ['2', 'Two'], ['3', 'Three'], ['4', 'Four'], ['5', 'Five'],
 
29
                    ['6', 'Six'], ['7', 'Seven'], ['8', 'Eight'], ['9', 'Nine']],
 
30
            tbar:[{
 
31
                text: 'clear',
 
32
                handler: function(){
 
33
                        msForm.getForm().findField('multiselect').reset();
 
34
                    }
 
35
            }],
 
36
            ddReorder: true
 
37
        }],
 
38
        tbar:[{
 
39
            text: 'Options',
 
40
            menu: [{
 
41
                    text: 'Set Value (2,3)',
 
42
                    handler: function(){
 
43
                        msForm.getForm().findField('multiselect').setValue('2,3');
 
44
                    }
 
45
                },{
 
46
                    text: 'Toggle Enabled',
 
47
                    handler: function(){
 
48
                        var m = msForm.getForm().findField('multiselect');
 
49
                        if (!m.disabled) {
 
50
                            m.disable();
 
51
                        } else {
 
52
                            m.enable();
 
53
                        }
 
54
                    }
 
55
            }]
 
56
        }],
 
57
 
 
58
        buttons: [{
 
59
            text: 'Save',
 
60
            handler: function(){
 
61
                if(msForm.getForm().isValid()){
 
62
                        Ext.Msg.alert('Submitted Values', 'The following will be sent to the server: <br />'+
 
63
                            msForm.getForm().getValues(true));
 
64
                }
 
65
            }
 
66
        }]
 
67
    });
 
68
 
 
69
 
 
70
    var ds = new Ext.data.ArrayStore({
 
71
        data: [[123,'One Hundred Twenty Three'],
 
72
            ['1', 'One'], ['2', 'Two'], ['3', 'Three'], ['4', 'Four'], ['5', 'Five'],
 
73
            ['6', 'Six'], ['7', 'Seven'], ['8', 'Eight'], ['9', 'Nine']],
 
74
        fields: ['value','text'],
 
75
        sortInfo: {
 
76
            field: 'value',
 
77
            direction: 'ASC'
 
78
        }
 
79
    });
 
80
 
 
81
    /*
 
82
     * Ext.ux.form.ItemSelector Example Code
 
83
     */
 
84
    var isForm = new Ext.form.FormPanel({
 
85
        title: 'ItemSelector Test',
 
86
        width:700,
 
87
        bodyStyle: 'padding:10px;',
 
88
        renderTo: 'itemselector',
 
89
        items:[{
 
90
            xtype: 'itemselector',
 
91
            name: 'itemselector',
 
92
            fieldLabel: 'ItemSelector',
 
93
                imagePath: '../ux/images/',
 
94
            multiselects: [{
 
95
                width: 250,
 
96
                height: 200,
 
97
                store: ds,
 
98
                displayField: 'text',
 
99
                valueField: 'value'
 
100
            },{
 
101
                width: 250,
 
102
                height: 200,
 
103
                store: [['10','Ten']],
 
104
                tbar:[{
 
105
                    text: 'clear',
 
106
                    handler:function(){
 
107
                            isForm.getForm().findField('itemselector').reset();
 
108
                        }
 
109
                }]
 
110
            }]
 
111
        }],
 
112
 
 
113
        buttons: [{
 
114
            text: 'Save',
 
115
            handler: function(){
 
116
                if(isForm.getForm().isValid()){
 
117
                    Ext.Msg.alert('Submitted Values', 'The following will be sent to the server: <br />'+
 
118
                        isForm.getForm().getValues(true));
 
119
                }
 
120
            }
 
121
        }]
 
122
    });
 
123
 
 
124
});