Line | |
---|
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 | |
---|
8 | Ext.onReady(function(){ |
---|
9 | |
---|
10 | Ext.QuickTips.init(); |
---|
11 | |
---|
12 | var msg = function(title, msg){ |
---|
13 | Ext.Msg.show({ |
---|
14 | title: title, |
---|
15 | msg: msg, |
---|
16 | minWidth: 200, |
---|
17 | modal: true, |
---|
18 | icon: Ext.Msg.INFO, |
---|
19 | buttons: Ext.Msg.OK |
---|
20 | }); |
---|
21 | }; |
---|
22 | |
---|
23 | var fibasic = new Ext.ux.form.FileUploadField({ |
---|
24 | renderTo: 'fi-basic', |
---|
25 | width: 400 |
---|
26 | }); |
---|
27 | |
---|
28 | new Ext.Button({ |
---|
29 | text: 'Get File Path', |
---|
30 | renderTo: 'fi-basic-btn', |
---|
31 | handler: function(){ |
---|
32 | var v = fibasic.getValue(); |
---|
33 | msg('Selected File', v && v != '' ? v : 'None'); |
---|
34 | } |
---|
35 | }); |
---|
36 | |
---|
37 | var fbutton = new Ext.ux.form.FileUploadField({ |
---|
38 | renderTo: 'fi-button', |
---|
39 | buttonOnly: true, |
---|
40 | listeners: { |
---|
41 | 'fileselected': function(fb, v){ |
---|
42 | var el = Ext.fly('fi-button-msg'); |
---|
43 | el.update('<b>Selected:</b> '+v); |
---|
44 | if(!el.isVisible()){ |
---|
45 | el.slideIn('t', { |
---|
46 | duration: .2, |
---|
47 | easing: 'easeIn', |
---|
48 | callback: function(){ |
---|
49 | el.highlight(); |
---|
50 | } |
---|
51 | }); |
---|
52 | }else{ |
---|
53 | el.highlight(); |
---|
54 | } |
---|
55 | } |
---|
56 | } |
---|
57 | }); |
---|
58 | |
---|
59 | var fp = new Ext.FormPanel({ |
---|
60 | renderTo: 'fi-form', |
---|
61 | fileUpload: true, |
---|
62 | width: 500, |
---|
63 | frame: true, |
---|
64 | title: 'File Upload Form', |
---|
65 | autoHeight: true, |
---|
66 | bodyStyle: 'padding: 10px 10px 0 10px;', |
---|
67 | labelWidth: 50, |
---|
68 | defaults: { |
---|
69 | anchor: '95%', |
---|
70 | allowBlank: false, |
---|
71 | msgTarget: 'side' |
---|
72 | }, |
---|
73 | items: [{ |
---|
74 | xtype: 'textfield', |
---|
75 | fieldLabel: 'Name' |
---|
76 | },{ |
---|
77 | xtype: 'fileuploadfield', |
---|
78 | id: 'form-file', |
---|
79 | emptyText: 'Select an image', |
---|
80 | fieldLabel: 'Photo', |
---|
81 | name: 'photo-path', |
---|
82 | buttonText: '', |
---|
83 | buttonCfg: { |
---|
84 | iconCls: 'upload-icon' |
---|
85 | } |
---|
86 | }], |
---|
87 | buttons: [{ |
---|
88 | text: 'Save', |
---|
89 | handler: function(){ |
---|
90 | if(fp.getForm().isValid()){ |
---|
91 | fp.getForm().submit({ |
---|
92 | url: 'file-upload.php', |
---|
93 | waitMsg: 'Uploading your photo...', |
---|
94 | success: function(fp, o){ |
---|
95 | msg('Success', 'Processed file "'+o.result.file+'" on the server'); |
---|
96 | } |
---|
97 | }); |
---|
98 | } |
---|
99 | } |
---|
100 | },{ |
---|
101 | text: 'Reset', |
---|
102 | handler: function(){ |
---|
103 | fp.getForm().reset(); |
---|
104 | } |
---|
105 | }] |
---|
106 | }); |
---|
107 | |
---|
108 | }); |
---|
Note: See
TracBrowser
for help on using the repository browser.