学步园

Extjs里文件上传需要扩展的组件，自己在做extjs例子，没有什么好的方法，网上找的也有很多不同的方法，我用的是Ext.ux.UploadDialog。
在文件里引用

xml 代码

<script type="text/javascript" src="lib/extjs.ux/Ext.ux.UploadDialog.js" ></script>
<script type="text/javascript" src="lib/extjs.ux/Ext.ux.ProgressBar.js" ></script>
<link rel="stylesheet" type="text/css" href="css/Ext.ux.ProgressBar.css"/>
<link rel="stylesheet" type="text/css" href="css/Ext.ux.UploadDialog.css"/>

然后在js的代码里加入：

js 代码

var dialog = new Ext.ux.UploadDialog.Dialog(null, {
          autoCreate: true,
          closable: true,
          collapsible: false,
          draggable: true,
          minWidth: 400,
          minHeight: 200,
          width: 400,
          height: 350,
          permitted_extensions:['JPG','jpg','jpeg','JPEG','GIF','gif'],
          proxyDrag: true,
          resizable: true,
          constraintoviewport: true,
          title: '文件上传',
          url: 't_file_upload.php',
          reset_on_hide: false,
          allow_close_on_upload: true
        });

在上传按钮单击时弹出上传对话框：

js 代码

btnUpload.on("click",function(){
                        dialog.show();
                    });

下面要做的事情就是在t_file_upload.php这个文件里面来处理上传后的操作了：

java 代码

<?php
    $file = "";
    $result = array();
    $ext = strrchr($_FILES["file"]["name"],'.');
    $file = "". date("YmdHis") . $ext;
    if(move_uploaded_file($_FILES["file"]["tmp_name"],"images/upload/" . $file)){
        $result = array('success'=>true,data=>$file);
    }else{
        $result = array('success'=> false, 'error'=> '文件上传错误');
    }
    echo json_encode($result);
?>

上传文件的内容就是file，是规定好的：）
附件中上传的是组件库

• Ext.ux.UploadDialog.zip (16 KB)
• 描述: 组件库