标签：
xtJS 4 有一个非常方便的文件上传组件，可以用来将文件上传到服务器。本文PHP教程UncleToo将介绍使用PHP和ExtJS实现文件上传功能。
首先，创建文件上传组件Ext.form.Panel，并添加一个上传按钮及按钮单击事件，该事件将验证并提交表单到upload.php的文件。看下面代码：
ExtJS部分
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
|
Ext.onReady(function () { Ext.widget(‘form‘, { title: ‘Upload Demo‘, width: 400, bodyPadding: 10, items: [{ xtype: ‘filefield‘, name: ‘file‘, fieldLabel: ‘File‘, labelWidth: 50, anchor: ‘100%‘, buttonText: ‘Select File...‘ }], buttons: [{ text: ‘Upload‘, handler: function () { var form = this.up(‘form‘).getForm(); if (form.isValid()) { form.submit({ url: ‘/extjs-tutorials/upload.php‘, waitMsg: ‘Uploading your file...‘, success: function (f, a) { var result = a.result, data = result.data, name = data.name, size = data.size, message = Ext.String.format(‘<b>Message:</b> {0}<br>‘ + ‘<b>FileName:</b> {1}<br>‘ + ‘<b>FileSize:</b> {2}‘, result.msg, name, size); Ext.Msg.alert(‘Success‘, message); }, failure: function (f, a) { Ext.Msg.alert(‘Failure‘, a.result.msg); } }); } } }], renderTo: ‘output‘ });}); |
效果预览：
Upload.php文件
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
|
<?phpif ($_FILES["file"]["error"] > 0){ $error = $_FILES["file"]["error"]; $response = array(‘success‘ => false, ‘msg‘ => $error); echo json_encode($response);}else{ $file_name = $_FILES["file"]["name"]; $file_type = $_FILES["file"]["type"]; $file_size = round($_FILES["file"]["size"] / 1024, 2) . " Kilo Bytes"; $response = array(‘success‘ => true, ‘data‘ => array(‘name‘ => $file_name, ‘size‘ => $file_size), ‘msg‘ => ‘File Uploaded successfully‘ ); echo json_encode($response);}?> |
选择要上传的文件，并点击上传按钮，效果如下：
标签：
原文地址：http://www.cnblogs.com/xred/p/5686712.html
