2007-09-12
ExtJs文件上传例子
Extjs里文件上传需要扩展的组件,自己在做extjs例子,没有什么好的方法,网上找的也有很多不同的方法,我用的是Ext.ux.UploadDialog。
在文件里引用
然后在js的代码里加入:
在上传按钮单击时弹出上传对话框:
下面要做的事情就是在t_file_upload.php这个文件里面来处理上传后的操作了:
上传文件的内容就是file,是规定好的:)
附件中上传的是组件库
在文件里引用
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 代码
- 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();
- });
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);
- ?>
附件中上传的是组件库
- 21:08
- 浏览 (3510)
- 评论 (13)
- 分类: JavaScript
- 相关推荐
评论
sailer
2008-07-22
t_file_upload.php这个文件的内容正确吗?它从哪里获得参数和值?
shan_gogo
2008-05-29
楼主 我想问下 这个Ext上传用的是1.x还是2.x???
我从Ext官方下载的Upload工具包里怎么只有
<script type="text/javascript" src="uploadDialog/Ext.ux.UploadDialog.js"></script>
<link rel="stylesheet" type="text/css" href="uploadDialog/css/Ext.ux.UploadDialog.css" />
没有其他的???
请指教
我从Ext官方下载的Upload工具包里怎么只有
<script type="text/javascript" src="uploadDialog/Ext.ux.UploadDialog.js"></script>
<link rel="stylesheet" type="text/css" href="uploadDialog/css/Ext.ux.UploadDialog.css" />
没有其他的???
请指教
kayzhan
2008-05-21
我按楼主的写的,结果总是说找不到dialog,说dialog没有定义。而我确实引入了那些文件阿
<script type="text/javascript" src="uploadDialog/Ext.ux.ProgressBar.js"></script>
<script type="text/javascript" src="uploadDialog/Ext.ux.UploadDialog.js"></script>
<script type="text/javascript" src="uploadDialog/uploadDialog.js"></script>
<link rel="stylesheet" type="text/css" href="uploadDialog/css/Ext.ux.UploadDialog.css" />
<link rel="stylesheet" type="text/css" href="uploadDialog/css/Ext.ux.ProgressBar.css" />
uploadDialog.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: 'servlet/ServletUpload',
reset_on_hide: false,
allow_close_on_upload: true
});
然后我在一个按钮里写
handler: function(){
dialog.show();
}
结果说dialog没有定义,怎么回事呢?
<script type="text/javascript" src="uploadDialog/Ext.ux.ProgressBar.js"></script>
<script type="text/javascript" src="uploadDialog/Ext.ux.UploadDialog.js"></script>
<script type="text/javascript" src="uploadDialog/uploadDialog.js"></script>
<link rel="stylesheet" type="text/css" href="uploadDialog/css/Ext.ux.UploadDialog.css" />
<link rel="stylesheet" type="text/css" href="uploadDialog/css/Ext.ux.ProgressBar.css" />
uploadDialog.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: 'servlet/ServletUpload',
reset_on_hide: false,
allow_close_on_upload: true
});
然后我在一个按钮里写
handler: function(){
dialog.show();
}
结果说dialog没有定义,怎么回事呢?
kaki
2008-03-24
我的已经解决了,主要是要注意servlet的命名和路径不要和其他应用重复,上面的方法可以通过。
kaki
2008-03-24
我的方法直接使用楼主的方法还是不能通过啊。好像根本不能提交数据一样。
hqmln422150393
2008-03-23
为什么我的页面都出不来啊?
kaki
2008-03-21
servlet:
package com.hiber;
import java.io.File;
import java.io.IOException;
import java.sql.Timestamp;
import java.text.SimpleDateFormat;
import java.util.Iterator;
import java.util.List;
import javax.servlet.*;
import javax.servlet.http.*;
import org.apache.commons.fileupload.*;
public class Upload extends HttpServlet {
/**
*
*/
private static final long serialVersionUID = 7440302204266787092L;
String uploadPath = "d:\\uploadtest\\"; // 用于存放上传文件的目录
String tempPath = "d:\\tmp\\"; // 用于存放临时文件的目录
public Upload() {
super();
System.out.println("文件上传启动");
}
public void destroy() {
super.destroy(); // Just puts "destroy" string in log
// Put your code here
}
public void init() throws ServletException {
System.out.println("文件上传初始化");
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws IOException, ServletException {
try {
System.out.println("开始进行文件上传");
DiskFileUpload fu = new DiskFileUpload();
fu.setSizeMax(4194304); // 设置最大文件尺寸,这里是4MB
fu.setSizeThreshold(4096); // 设置缓冲区大小,这里是4kb
fu.setRepositoryPath(tempPath); // 设置临时目录
List fileItems = fu.parseRequest(request); // 得到所有的文件:
Iterator i = fileItems.iterator();
// 依次处理每一个文件:
while (i.hasNext()) {
FileItem fi = (FileItem) i.next();
String fileName = fi.getName();// 获得文件名,这个文件名包括路径:
if (fileName != null) {
// 在这里可以记录用户和文件信息
// 此处应该定义一个接口(CallBack),用于处理后事。
// 写入文件a.txt,你也可以从fileName中提取文件名:
String extfile = fileName.substring(fileName.indexOf("."));
Timestamp now = new Timestamp((new java.util.Date())
.getTime());
SimpleDateFormat fmt = new SimpleDateFormat("yyyyMMddHHmmssSSS");
String pfileName= fmt.format(now).toString().trim();
System.out.println(uploadPath+pfileName+extfile);
fi.write(new File(uploadPath + pfileName + extfile));
}
}
response.setContentType("text/html;charset=utf-8");
response.getWriter().print("{success:true,message:'上传成功'}");
//response.getWriter().print("{success:true,msg:'成功'}");
// 跳转到上传成功提示页面
} catch (Exception e) {
e.printStackTrace();
response.getWriter().print("{success:flase,message:'失败'}");
// 可以跳转出错页面
}
}
}
kaki
2008-03-21
servlet 大家用过吗??
我的serlet在jsp里面可以正常用,但是放在楼主的例子里面就不行了,大家看看可以吗??
我的serlet在jsp里面可以正常用,但是放在楼主的例子里面就不行了,大家看看可以吗??
Ext.onReady(function() {
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: "fileupload",
reset_on_hide: false,
allow_close_on_upload: true
});
dialog.show('my-dlg');
});
kaki
2008-03-19
java 版的有没有???
sariy
2008-03-17
请问java后台怎么接文件啊 搞了好久接不到啊
谢谢 qq:121656995
email:suyuan_6@163.com
谢谢 qq:121656995
email:suyuan_6@163.com
zjnbshifox
2008-03-05
Uploadform还有base_params这个属性可以用来添加额外的参数
http://www.max-bazhenov.com/dev/upload-dialog-2.0/index.php
http://www.max-bazhenov.com/dev/upload-dialog-2.0/index.php
zjnbshifox
2008-03-05
t_file_upload.php?filepath=icon/ 这个样子参数应该从 $_GET["filepath"]取得吧,
hongfulover
2008-03-02
请教一下:"images/upload/",你这个上传是路径是写了,如果我需要从上传页传一个路径可以怎么做?我试过用t_file_upload.php?filepath=icon/,不行的。
发表评论
- 浏览: 17558 次
- 性别:

- 来自: 宁波

- 详细资料
搜索本博客
最近加入圈子
最新评论
-
JAXB的使用
您好, 我想问一下sun.security.krb5.internal.cry ...
-- by xiaxiaojuan -
EXT自定义窗体加载数据
我想问一下:主界面是这样的:左侧是树形菜单,右侧是iframe。假如某个界面有两 ...
-- by chenxiaoji -
ExtJs文件上传例子
t_file_upload.php这个文件的内容正确吗?它从哪里获得参数和值?
-- by sailer -
ExtJs文件上传例子
楼主 我想问下 这个Ext上传用的是1.x还是2.x??? 我从Ext官方下载 ...
-- by shan_gogo -
ExtJs文件上传例子
我按楼主的写的,结果总是说找不到dialog,说dialog没有定义。而我确实引 ...
-- by kayzhan






评论排行榜