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,是规定好的:)
分享到:
相关推荐
在ExtJS中,UploadDialog是一个专为文件上传设计的组件,它提供了用户友好的界面,允许用户选择并上传多个文件到服务器。这篇博客文章(虽然链接无法直接访问,但我们可以根据已知信息推测内容)可能详细介绍了如何...
这个"Ext.ux.UploadDialog.zip"压缩包包含了EXTjs的UploadDialog组件,方便开发者在自己的项目中直接使用。 UploadDialog组件的核心功能是提供一个用户友好的界面,让用户能够选择并上传文件到服务器。这个组件通常...
在"struts+extjs实现UploadDialog"这个主题中,我们主要讨论如何利用Struts和ExtJS来创建一个文件上传对话框。UploadDialog通常是一个交互式的用户界面,允许用户选择本地文件并将其上传到服务器。 首先,让我们从...
### ExtJS 多文件上传 UploadDialog For ExtJS3.x #### 概述 在Web开发领域,特别是使用ExtJS框架进行界面设计时,文件上传功能是必不可少的一部分。然而,随着ExtJS版本的更新,原有的多文件上传组件可能不再兼容...
在本文中,我们将深入探讨如何使用ExtJS的UploadDialog插件与Struts2.0框架相结合,实现一个功能完备的多文件上传功能。这是一项在Web应用开发中常见的需求,对于用户交互性和数据管理有着重要作用。 首先,让我们...
"extjs.ux.uploaddialog"是专门为ExtJS设计的一个上传对话框组件,它允许用户在一个对话框界面中方便地上传文件。 UploadDialog组件的核心功能在于提供一个交互式的文件选择和上传界面,通常包含文件选择按钮、文件...
最后,在ExtJS中创建`UploadDialog`实例,配置好URL、参数、回调函数等,这样当用户选择文件并点击上传按钮时,就会触发Struts2 Action的执行,从而实现多文件上传。 综上所述,实现ExtJS 3.x的多文件上传功能,...
在ExtJS 2.x版本中,UploadDialog已经被广泛使用,但随着版本升级,对于ExtJS 3.2.1这样的较新版本,官方并未发布专门的UploadDialog组件。这导致了开发者在寻找适合3.x系列的UploadDialog时面临困难,因为非官方的...
`UploadDialog3_x`组件就是这样一个解决方案,专为Ext框架设计,旨在提供高效且用户友好的批量上传体验。Ext是一个强大的JavaScript应用程序框架,它提供了丰富的UI组件和数据管理工具,使得开发者能够构建复杂的Web...
在IT行业中,网页开发经常会遇到文件上传的需求,而"jSP+EXTJS实现upload UploadDialog"就是一种常见的解决方法。这个话题主要涵盖了两个关键部分:JavaServer Pages (JSP) 和 ExtJS,它们共同用于创建一个具有文件...
Ext.ux.UploadDialog是一款在ExtJS框架下使用的扩展组件,它提供了一种用户友好的文件上传界面和功能。这个组件通常被用于Web应用程序,让用户能够方便地上传文件到服务器,而无需离开当前页面或者打开新的浏览器...
"UploadDialog.rar"可能包含一个基于ExtJS的文件上传对话框示例。通常,这种对话框会展示一个文件选择器,用户可以选择多个文件进行上传,并且可能包括上传进度的显示。 3. **ExtJS 进度条**: "ExtJS进度条.txt...
综上所述,"UploadDialog"是一个使用ExtJS创建的无插件多文件上传对话框,它结合了HTML5 File API、ExtJS组件模型和异步传输技术,为用户提供了一种便捷且高度可定制的文件上传解决方案。在实际项目中,开发者可以...
- `b2b/Ext.ux.UploadDialog.js`: 文件上传对话框组件。 ##### 2.1 页面布局实现 在实际应用中,可以通过ExtJs的布局管理器来实现页面的布局设计。下面是一个简单的例子,展示了如何使用ExtJs的BorderLayout布局...
Ext.ux.UploadDialog是Ext 2.0框架中的一...总的来说,Ext.ux.UploadDialog为ExtJS开发者提供了一种强大且易用的文件上传解决方案,通过它,我们可以轻松地将复杂、高效且用户友好的文件上传功能整合到Web应用程序中。
14.3.2 常用插件UploadDialog 14.3.3 常用插件ManagedIFrame 14.4 使用ExtJS制作Flash统计报表 14.4.1 柱状图 14.4.2 折线图 14.4.3 饼状图 14.4.4 柱状栈图 第15章 调试JavaScript与HTML 15.1 Firebug的...
在本文中,我们将深入探讨如何使用Ext.ux.UploadDialog组件结合FTP(文件传输协议)来实现异步上传功能,这是在ExtJs框架下进行Web应用开发时一个实用的技术点。Ext.ux.UploadDialog是一个第三方扩展,它为ExtJs提供...
首先,Ext.ux.UploadDialog是一个基于ExtJS框架的组件,它允许用户在一个对话框中选择并上传多个文件。这个组件通常包含一个文件选择输入框、上传按钮、进度条和取消上传的功能。它的主要优势在于能够提供友好的用户...
Ext.ux.UploadDialog批量上传文件实例是一个基于ExtJS组件库扩展插件的文件上传解决方案,主要针对需要一次性处理多个文件上传的应用场景。ExtJS是一个强大的JavaScript框架,它提供了丰富的用户界面组件,而Ext.ux....