`

Ext ajax 上传文件

    博客分类:
  • ext
阅读更多
页面代码
<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上传文件

    标题中的“ext上传文件”可能指的是使用EXTJS(一个JavaScript库)进行文件上传的功能。EXTJS提供了一套完整的用户界面组件,其中包括文件上传组件,它允许用户在Web应用中方便地上传文件。EXTJS通常与后端服务器...

    Ext3.0实现多文件上传.rar

    3. **AJAX上传**: 为了实现无刷新的上传体验,Ext3.0会使用AJAX技术,通过XMLHttpRequest对象发送POST请求,将FormData对象作为请求体发送到服务器。这使得用户可以在上传过程中继续浏览网页,无需等待整个上传过程...

    Ext上传文件 Demo

    本示例“Ext上传文件 Demo”聚焦于如何使用Ext JavaScript库与ASP.NET后端相结合来实现文件上传。下面将详细阐述相关知识点。 首先,Ext是一个强大的JavaScript框架,用于构建富客户端应用程序。它提供了丰富的组件...

    Ext 文件上传参考文档

    Ext 文件上传参考文档主要涉及的是在Web开发中处理文件上传的场景,特别是使用ExtJS框架进行前端交互。ExtJS是一个强大的JavaScript库,用于构建复杂的、数据驱动的Web应用程序。文件上传是用户界面中的常见功能,...

    EXT文件批量上传源代码

    9. **权限控制**:可以设定上传文件的大小限制、类型限制,以满足安全性和业务需求。 10. **分块上传**:对于大文件,EXT还可以采用分块上传策略,将大文件拆分成小块分别上传,提高上传成功率。 在实际使用EXT...

    Ext 文件上传的完整列子

    在这个事件中,我们可以获取到用户选择的文件对象,然后使用Ajax或者新的HTML5 File API进行上传。例如: ```javascript fileField.on('change', function(field, value) { var file = field.inputEl.dom.files[0]...

    ext多文件上传

    - **删除**:EXTJS的GridPanel可以展示已上传文件列表,通过添加一个删除按钮和监听事件,我们可以方便地删除文件。例如,为每一行添加一个工具栏,其中包含一个删除按钮,点击后发送请求至服务器删除指定文件。 - ...

    ext 文件上传

    "ext 文件上传"这个主题可能指的是EXTJS框架中的文件上传组件或者相关的扩展功能。EXTJS是一个流行的JavaScript库,用于构建富客户端应用程序,它提供了丰富的组件和强大的数据绑定机制。 在EXTJS中,文件上传通常...

    Ext 3.x 文件批量上传

    例如,`Ext.Ajax.upload()`方法可以用于异步上传文件,而`onSuccess`和`onFailure`回调函数则可以用来处理上传成功或失败后的响应。 总结来说,实现Ext 3.x中的文件批量上传涉及到创建一个包含`FileUploadField`的...

    Ext 文件上传demo

    3. **异步上传**:EXT的文件上传通常与Ajax结合,实现非刷新页面的文件上传。这涉及到`Ajax请求`和`FormData对象`,它们可以将文件内容作为二进制数据发送到服务器。 4. **进度条显示**:为了提升用户体验,EXT ...

    Ext上传文件控件

    在给定的"Ext上传文件控件"中,我们关注的是ExtJS如何处理文件上传的功能。ExtJS 提供了一个名为`Ext.form.FileField`(也称为`Ext.form.field.File`)的组件,允许用户在Web表单中选择和上传文件。这个控件通常与`...

    Ext 实现 文件上传 进度显示

    实现文件上传进度显示的关键在于使用Ajax异步请求,`Ext.Ajax`或`Ext.data.Connection`可以用来配置这种请求。我们需要开启`async: true`,设置`params`参数以包含文件数据,同时启用`progress`事件监听,以便在每次...

    Ext2.0 文件上传组件

    - XHR(XMLHttpRequest)或Fetch API:使用现代浏览器支持的API进行AJAX上传,确保无刷新体验。 3. **源码分析**: - `UploadDialog`可能是一个具体的类,负责创建一个对话框,包含文件选择和上传按钮。源码中...

    Ext文件上传、下载

    - `Ajax上传`:`Ext`支持使用Ajax进行文件上传,这意味着文件上传可以在不刷新页面的情况下完成,提供更好的用户体验。这通常通过设置`FormPanel`的`useAjax`为`true`实现。 - `FormData`对象:在HTML5中,`...

    Ext文件上传完整包

    它可能利用了HTML5的File API来处理文件选择和上传,同时也可能使用Ajax技术实现异步上传,以保持用户界面的响应性。 在实际应用中,使用"Ext.ux.dialog UploadDialog"可能会涉及以下步骤: 1. **配置和创建对话框...

    Ext 文件上传 Icons

    总之,"Ext 文件上传 Icons"涉及了使用ExtJS和SWFUpload实现文件上传,以及通过DataView组件展示带有图标信息的已上传文件列表。理解并熟练运用这些知识点,可以让我们构建出功能完善、用户体验优秀的文件上传系统。...

    Ext3-Js-Ajax框架-分页标签-自动排序-文件上传

    Ext3-Js-Ajax框架-分页标签-自动排序-文件上传Ext-Js-Ajax框架-分页标签-自动排序-文件上传Ext-Js-Ajax框架-分页标签-自动排序-文件上传Ext-Js-Ajax框架-分页标签-自动排序-文件上传Ext-Js-Ajax框架-分页标签-自动...

    Ext相册实现文件拖拽,实时上传进度,本地预览

    4. **上传文件**:EXT4的FormPanel可以方便地处理文件上传,通过设置`enctype="multipart/form-data"`,结合Ajax请求,可以实现异步上传。 **实时上传进度** 1. **使用FormData对象**:HTML5的FormData对象允许我们...

    Ext多文件上传

    3. **Ajax上传**:传统的表单提交会导致页面刷新,这并不适合多文件上传。使用Ajax技术,我们可以异步地将文件数据发送到服务器,保持用户界面的活跃。ExtJS的`Ext.Ajax`类提供了这个功能,配合`FormData`对象,可以...

Global site tag (gtag.js) - Google Analytics