页面代码
<form id="upForm">
请选择文件:<input type="file" name="file1"><br /> 文件描述:
<textarea cols="70" rows="5" name="desc"></textarea>
<br /> <input type="button" id="btn" value="上传">
</form>
<script type="text/javascript">
Ext.onReady(function() {
Ext.MessageBox.alert("测试", "测试Ext是否运行");
Ext.get("btn").on("click", function() {
Ext.Ajax.request({
url : "FileUpServlet",
isUpload : true,
form : "upForm",
success : function(response) {
Ext.MessageBox.alert("上传成功", response.responseText);
}
});
});
});
</script>
后台servlet代码
public class FileUpServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
public FileUpServlet() {
super();
}
@Override
public void service(ServletRequest request, ServletResponse response)
throws ServletException, IOException {
request.setCharacterEncoding("utf-8");
response.setCharacterEncoding("utf-8");
response.setContentType("text/html;charset=utf-8");
ServletContext ctx = this.getServletContext();
String userFilePath = ctx.getRealPath("userFile");
DiskFileItemFactory factory = new DiskFileItemFactory();
factory.setSizeThreshold(1024 * 1024);
factory.setRepository(new File(userFilePath));
ServletFileUpload upload = new ServletFileUpload(factory);
upload.setSizeMax(10 * 1024 * 1024);
try {
List<FileItem> fileItems = upload.parseRequest((HttpServletRequest) request);
System.out.println(fileItems.size());
Iterator<FileItem> iter = fileItems.iterator();
while (iter.hasNext()) {
FileItem fi = iter.next();
if (fi.isFormField()) {
String fieldName = fi.getFieldName();
String fieldvalue = fi.getString();
System.out.println("name:" + fieldName);
System.out.println("value:" + fieldvalue);
} else {
String filePath = fi.getName();
if (filePath != null) {
System.out.println(filePath);
}
if (StringUtil.isBlank(filePath)) {
continue;
}
String extensionName = filePath.substring(
filePath.lastIndexOf("."), filePath.length());
// String contentType = fi.getContentType();
// boolean isInMemory = fi.isInMemory();
// long sizeInBytes = fi.getSize();
String url = userFilePath +"\\"+ StringUtil.getUUID()
+ extensionName;
File uploadedFile = new File(url);
if (!uploadedFile.exists()) {
uploadedFile.getParentFile().mkdirs();
}
fi.write(uploadedFile);
}
}
PrintWriter out = response.getWriter();
out.print("创建成功");
out.flush();
out.close();
} catch (Exception e) {
e.printStackTrace();
}
}
}
分享到:
相关推荐
标题中的“ext上传文件”可能指的是使用EXTJS(一个JavaScript库)进行文件上传的功能。EXTJS提供了一套完整的用户界面组件,其中包括文件上传组件,它允许用户在Web应用中方便地上传文件。EXTJS通常与后端服务器...
3. **AJAX上传**: 为了实现无刷新的上传体验,Ext3.0会使用AJAX技术,通过XMLHttpRequest对象发送POST请求,将FormData对象作为请求体发送到服务器。这使得用户可以在上传过程中继续浏览网页,无需等待整个上传过程...
本示例“Ext上传文件 Demo”聚焦于如何使用Ext JavaScript库与ASP.NET后端相结合来实现文件上传。下面将详细阐述相关知识点。 首先,Ext是一个强大的JavaScript框架,用于构建富客户端应用程序。它提供了丰富的组件...
Ext 文件上传参考文档主要涉及的是在Web开发中处理文件上传的场景,特别是使用ExtJS框架进行前端交互。ExtJS是一个强大的JavaScript库,用于构建复杂的、数据驱动的Web应用程序。文件上传是用户界面中的常见功能,...
9. **权限控制**:可以设定上传文件的大小限制、类型限制,以满足安全性和业务需求。 10. **分块上传**:对于大文件,EXT还可以采用分块上传策略,将大文件拆分成小块分别上传,提高上传成功率。 在实际使用EXT...
在这个事件中,我们可以获取到用户选择的文件对象,然后使用Ajax或者新的HTML5 File API进行上传。例如: ```javascript fileField.on('change', function(field, value) { var file = field.inputEl.dom.files[0]...
- **删除**:EXTJS的GridPanel可以展示已上传文件列表,通过添加一个删除按钮和监听事件,我们可以方便地删除文件。例如,为每一行添加一个工具栏,其中包含一个删除按钮,点击后发送请求至服务器删除指定文件。 - ...
"ext 文件上传"这个主题可能指的是EXTJS框架中的文件上传组件或者相关的扩展功能。EXTJS是一个流行的JavaScript库,用于构建富客户端应用程序,它提供了丰富的组件和强大的数据绑定机制。 在EXTJS中,文件上传通常...
例如,`Ext.Ajax.upload()`方法可以用于异步上传文件,而`onSuccess`和`onFailure`回调函数则可以用来处理上传成功或失败后的响应。 总结来说,实现Ext 3.x中的文件批量上传涉及到创建一个包含`FileUploadField`的...
3. **异步上传**:EXT的文件上传通常与Ajax结合,实现非刷新页面的文件上传。这涉及到`Ajax请求`和`FormData对象`,它们可以将文件内容作为二进制数据发送到服务器。 4. **进度条显示**:为了提升用户体验,EXT ...
在给定的"Ext上传文件控件"中,我们关注的是ExtJS如何处理文件上传的功能。ExtJS 提供了一个名为`Ext.form.FileField`(也称为`Ext.form.field.File`)的组件,允许用户在Web表单中选择和上传文件。这个控件通常与`...
实现文件上传进度显示的关键在于使用Ajax异步请求,`Ext.Ajax`或`Ext.data.Connection`可以用来配置这种请求。我们需要开启`async: true`,设置`params`参数以包含文件数据,同时启用`progress`事件监听,以便在每次...
- XHR(XMLHttpRequest)或Fetch API:使用现代浏览器支持的API进行AJAX上传,确保无刷新体验。 3. **源码分析**: - `UploadDialog`可能是一个具体的类,负责创建一个对话框,包含文件选择和上传按钮。源码中...
- `Ajax上传`:`Ext`支持使用Ajax进行文件上传,这意味着文件上传可以在不刷新页面的情况下完成,提供更好的用户体验。这通常通过设置`FormPanel`的`useAjax`为`true`实现。 - `FormData`对象:在HTML5中,`...
它可能利用了HTML5的File API来处理文件选择和上传,同时也可能使用Ajax技术实现异步上传,以保持用户界面的响应性。 在实际应用中,使用"Ext.ux.dialog UploadDialog"可能会涉及以下步骤: 1. **配置和创建对话框...
总之,"Ext 文件上传 Icons"涉及了使用ExtJS和SWFUpload实现文件上传,以及通过DataView组件展示带有图标信息的已上传文件列表。理解并熟练运用这些知识点,可以让我们构建出功能完善、用户体验优秀的文件上传系统。...
Ext3-Js-Ajax框架-分页标签-自动排序-文件上传Ext-Js-Ajax框架-分页标签-自动排序-文件上传Ext-Js-Ajax框架-分页标签-自动排序-文件上传Ext-Js-Ajax框架-分页标签-自动排序-文件上传Ext-Js-Ajax框架-分页标签-自动...
4. **上传文件**:EXT4的FormPanel可以方便地处理文件上传,通过设置`enctype="multipart/form-data"`,结合Ajax请求,可以实现异步上传。 **实时上传进度** 1. **使用FormData对象**:HTML5的FormData对象允许我们...
3. **Ajax上传**:传统的表单提交会导致页面刷新,这并不适合多文件上传。使用Ajax技术,我们可以异步地将文件数据发送到服务器,保持用户界面的活跃。ExtJS的`Ext.Ajax`类提供了这个功能,配合`FormData`对象,可以...