extjs4多文件上傳
A. extjs ajax 可以上傳文件嗎
文件上傳的Ajax，首先Ajax並不支持流的傳輸，只是在裡面套了個iframe。
//ajax上傳
Ext.get('btn').on('click',function(){
Ext.Ajax.request({
url:'Upload.php',
isUpload:true,
form:'upform',
success:function(){
Ext.Msg.alert('upfile','文件上傳成功！');
}
});
});
<formid="upform">
請選擇文件：<inputtype="file"name="imgFile"/>
<inputtype="button"id="btn"value="上傳"/>
</form>
<?php
if(!isset($_FILES['imgFile'])){
echojson_encode(array("success"=>false,'msg'=>"NotgetImgfile"));
return;
}
$upfile=$_FILES['imgFile'];
$name=$upfile["name"];//上傳文件的文件名
$type=$upfile["type"];//上傳文件的類型
$size=$upfile["size"];//上傳文件的大小
$tmp_name=$upfile["tmp_name"];//上傳文件的臨時存放路徑
$error_cod=$upfile["error"];
if($error_cod>0){
echojson_encode(array("success"=>false,'msg'=>$error_cod));
}
$photo_tmp_file_name=//這里設置存放路徑
move_uploaded_file($tmp_name,$photo_tmp_file_name);//存儲文件
?>
B. 誰做過ExtJS上傳下載文件的功能，求教
//附件上傳表單
varwareFrom=Ext.create('Ext.form.Panel',{
items:[{
xtype:'filefield',
name:'upfile',
fieldLabel:'文件上傳',
blankText:'請選擇文件',
allowBlank:false
}]
});
//創建一個窗體
varwin=Ext.create('Ext.window.Window',{
title:'上傳課件',
width:'auto',
height:'auto',
layout:'fit',
items:wareFrom,
buttonAlign:'center',
buttons:[{
minWidth:80,
text:'取消',
handler:function(){ win.hide(); }
},{
minWidth:80,
text:'上傳',
handler:upLoad
}]
});
//顯示窗體
win.show();
//點擊上傳按鈕處理事件
functionupLoad(){
if(wareFrom.getForm().isValid()){
wareFrom.getForm().submit({
waitTitle:'請稍候',
waitMsg:'正在執行操作...',
url:'upload.php?upload=ok',
method:'POST',
success:function(form,action){
Ext.Msg.alert('提示',action.result.msg);
wareFrom.getForm().reset();
},
failure:function(form,action){
Ext.Msg.alert('提示',action.result.msg);
}
});
}
}
//後台不管你用的什麼，流程一致，此以php為例，因為比較好寫
<?php
if($_GET['upload']=='ok'){
//上傳路徑
$location='upload_file/';
//此處的name是上傳窗體，upload控制項的name
if(move_uploaded_file($_FILES['upfile']['tmp_name'],$location)){
echojson_encode(array('success'=>true,'msg'=>'上傳成功'));
}else{
echojson_encode(array('success'=>false,'msg'=>'上傳發生了錯誤'));
}
}
?>
//下載
<?php
//此處需前台傳一個id過來
$id=$_GET['id'];
$sql="SELECT*FROM`ware`WHERE`id`='$id'";
$result=mysql_query($sql);
$row=mysql_fetch_row($result);
//此處的row是文件保存在資料庫的路徑
if(file_exists($row[0])){
//用stream讀取該文件
$file=fopen($row[0],'r');
header('Content-Type:application/octet-stream');
header('Accept-Ranges:bytes');
header('Accept-Length:'.filesize($row[0]));
//此處的row1是文件名稱
header('Content-Disposition:attachment;filename='.$row[1]);
echofread($file,filesize($row[0]));
fclose($file);
}
?>
//有什麼地方不明白的話，歡迎繼續追問
C. EXT html <input type='file' />上傳文件 可以一次同時選多個文件嗎
D. 怎麼將文件上傳和表單提交分開處理
上傳這樣的功能本來就應該獨立出來，為以後能夠更好的擴展和組件重用做准備。至於你的這個問題也很容易處理，問題的關鍵不在於後台處理的程序如何安排，而在於頁面的表現形式，因為程序本身既然獨立出來了，你的ACTION也是獨立出來的，那麼就把頁面里的上傳功能獨立出來。
舉例來說：
在你的表單里添加一個上傳按鈕，點擊後彈出一個漂浮的div圖層，然後在這個圖層里可以放置單個的文件瀏覽按鈕，或者動態的增加多個需要上傳的瀏覽按鈕，都是很靈活的，然後把這個圖層使用單獨的form標簽包圍起來就可以了。
類似的功能像很多論壇程序都在使用，比較成熟的js組件也可以實現，比如ExtJs、jQuery等等，一般來說能夠提供web editor功能的js組件對於上傳都是類似的處理方式。
E. 我想用extjs實現上傳和下載
給你上傳代碼，下載在服務端實現
重點是 xtype: 'filefield',
*************************************************************************
*上傳框組件
*
************************************************************************
*/
Ext.define('Mocoolka.web.coreview.container.MKUploadForm', {
extend:'Ext.form.Panel',
frame: true,
autoScroll: true,
initComponent: function () {
var me = this;
me.title = getUIWithID("SystemUI.Buttons.Upload.Description");//'上傳',
me.items = [
{
xtype: 'filefield',
emptyText: getUIWithID("SystemUI.MKUploadForm.SelectFile.Description"),//'選擇一個文件',
name: 'filename',
buttonText: '...',
buttonConfig: {
iconCls: 'upload-icon'
}
},
];
me.buttons = [{
text: getUIWithID("SystemUI.Buttons.Upload.Description"),//'上傳',
handler: function () {
var form = this.up('form').getForm();
var action = this.up('form').mkaction;
var myaction = "import";
if (action.get("Name") == "ImportAttachment")
myaction = "ImportAttachment";
var url = mkruntimer.getDataManager().getUrlPath(myaction, action);
if (form.isValid()) {
form.submit({
url: url,
waitMsg: getUIWithID("SystemUI.Buttons.Uploading.Description"),//'上傳中...',
success: function (fp, o) {
var form1 = form.owner;
form1.mkcallout(form1.mkcalloutpara, action.result.children);
form1.up('window').close();
},
failure: function (form, action) {
mkerrorutil.processAjaxFailure(action.response);
}
});
}
}
}, {
text: getUIWithID("SystemUI.Buttons.Reset.Description"),//'重設',
handler: function () {
this.up('form').getForm().reset();
}
}, {
text: getUIWithID("SystemUI.Buttons.Cancel.Description"),//'取消',
handler: function () {
this.up('window').close();
}
},
{
text: getUIWithID("SystemUI.MKUploadForm.AddFile.Description"),//'增加一個文件',
handler: function () {
this.up('form').addFile();
}
}
]
me.callParent(arguments);
},
addFile: function () {
var me = this;
me.add({
xtype: 'filefield',
emptyText: getUIWithID("SystemUI.MKUploadForm.SelectFile.Description"),//'選擇一個文件',
fieldLabel: getUIWithID(""),// '文件',
name: 'filename',
buttonText: '',
buttonConfig: {
iconCls: 'upload-icon'
}
});
},
//standardSubmit:false,
bodyPadding: '10 10 0',
flex:1,
defaults: {
anchor: '100%',
msgTarget: 'side',
labelWidth: 50
},
region: 'center',
});
F. ExtJs中的文件上傳下載功能求教,100分
http://hi..com/%B1%F9%C3%CE%CE%DE%BA%DB/blog/item/3b19542954c90ff799250a29.html
前台EXT（假設上傳文件為2個）：主要就是個formPanel,items中寫為:
{
xtype : 'textfield',
fieldLabel : '上傳文件1',
name : 'file',
inputType : 'file'
}, {
xtype : 'textfield',
fieldLabel : '上傳文件2',
name : 'file',
inputType : 'file'
}
其他地方不詳細訴說了，不明白看EXT表單提交去，別忘記fileUpload : true就可以了
注意：因為是用struts2處理，name都是一樣的file
struts2後台：
private List<File> file;對應前面的name
// 使用列表保存多個上傳文件的文件名
private List<String> fileFileName;
// 使用列表保存多個上傳文件的MIME類型
private List<String> fileContentType;
// 保存上傳文件的目錄，相對於Web應用程序的根路徑，在struts.xml文件中配置
private String uploadDir;
get/set方法略
public void fileUpLoad() {
String newFileName = null;
BufferedOutputStream bos = null;
BufferedInputStream bis = null;
String reInfo="";//上傳成功返回的東西
for (int i = 0; i < file.size(); i++) {
long now = new Date().getTime();
int index = fileFileName.get(i).lastIndexOf('.');
String path = ServletActionContext.getServletContext().getRealPath(
uploadDir);
File dir = new File(path);
if (!dir.exists())
dir.mkdir();//創建個文件夾
if (index != -1)
newFileName = fileFileName.get(i).substring(0, index) + "-"
+ now + fileFileName.get(i).substring(index);//生成新文件名
else
newFileName = fileFileName.get(i) + "-" + now;
reInfo+=newFileName+"@";
bos = null;
bis = null;
try {
FileInputStream fis = new FileInputStream(file.get(i)); // /////////
bis = new BufferedInputStream(fis);
FileOutputStream fos = new FileOutputStream(new File(dir,
newFileName));
bos = new BufferedOutputStream(fos);
byte[] buf = new byte[4096];
int len = -1;
while ((len = bis.read(buf)) != -1) {
bos.write(buf, 0, len);
}
} catch (Exception e) {
/////錯誤返回
try {
HttpServletResponse response = ApplicationWebRequestContext
.getWebApplicationContext().getResponse();
String msg = "{success:false,errors:{name:'上傳錯誤'}}";
response.getWriter().write(msg);
} catch (IOException e1) {
// TODO Auto-generated catch block
e1.printStackTrace();
}
////////
} finally {
////////////////////////善後
try {
if (null != bis)
bis.close();
} catch (IOException e) {
e.printStackTrace();
}
try {
if (null != bos)
bos.close();
} catch (IOException e) {
e.printStackTrace();
}
}
////////////////////////////////
}
//最後若沒錯誤返回就這里返回了
try {
HttpServletResponse response = ApplicationWebRequestContext
.getWebApplicationContext().getResponse();
response.setCharacterEncoding("UTF-8");
response.setContentType("text/html");
String msg = "{success:true,msg:'"+reInfo+"'}";
response.getWriter().write(msg);
} catch (Exception e) {
e.printStackTrace();
}
}
改方法參考了孫鑫的strut2深入詳解，自己修改而成
注意上面2個黑體，尤其是第2行，不加的話瀏覽器會很悲劇的再你上傳陳宮以後的返回前後加上<pre>，於是ext表單獲得返回失敗，這就是為什麼有些人用其他EXT上傳組件時候上傳成功一直卡成進度條那
G. extjs怎麼判斷上傳文件名的名稱格式大小，不是後綴是文件名稱
ExtJs能不能不知道（貌似不可以），但是可以用別的方式達到。給你提供個思路：比襪握如你限制僅能上傳txt，pdf，xml，doc格式的文件，上傳
時，先獲取上傳的文件名，截基歲取文件的後綴名（這個很簡單，用split功能就可以了，以
.（點）作為分隔符），然後跟允許的上傳格式字元對比，如果不同，則不允許上傳，相同則允許（其實搏好睜用正則表達式也是可以的）。比如：
var a="filename.pdf"（文件名自己去獲取）
var b=a.split(".")（截取之後是個數組["filename","pdf"]）
b[1]就是後綴名pdf
這樣再對比：if(
b[1]
.toLowerCase()==『pdf』)
alert("ok");
H. Extjs4.2上傳文本框只讀和賦值
使用setReadOnly(true)方法改為只讀
I. ExtJs可以限制上傳文件的格式嗎
ExtJs能不能不知道（貌似不可以），但是可以用別的方式達到。給你提供個思路：比如你限制僅能上傳txt，pdf，xml，doc格式的文件，上傳時，先獲取上傳的文件名，截取文件的後綴名（這個很簡單，用split功能就可以了，以 .（點）作為分隔符），然後跟允許的上傳格式字元對比，如果不同，則不允許上傳，相同則允許（其實用正則表達式也是可以的）。比如：
var a="filename.pdf"（文件名自己去獲取）
var b=a.split(".")（截取之後是個數組["filename","pdf"]）
b[1]就是後綴名pdf
這樣再對比：if(
b[1]
.toLowerCase()==『pdf』)
alert("ok");