ajaxform文件上傳
⑴ ajax非同步表單提交能不能上傳文件
上傳的文件是沒有辦法和表單內容一起非同步的，可考慮使用jquery的ajaxfileupload，或是其他的耐虛插件，非同步上傳文件後昌嘩燃，然後再對表蘆侍單進行操作。
⑵ ajax不用form提交數據嗎
在表單上傳文件的時候必須設置enctype="multipart/form-data"表示表單既有文本數據，又有文件等二進制數據。但是使用用Ajax沒有enctype="multipart/form-data"，所以不能直接上傳文件，所以採用FormData對象包含數據上傳。
這里我們不使用Ajax，直接提交表單，添加一個隱藏得iframe，將form表單的target指向這個iframe來阻止刷新並且上傳文件。
<form method="POST" action="./upload.php" enctype="multipart/form-data" target='ifr' id="form1">
<label for="name">name:</label><input type="text" id="name" name="name"/><br/升謹>
<input type="file" name="file" >
<input type="submit" value="提交">
</form>
接著，我們要獲取返回值
var iframe=document.getElementById("ifr");
iframe.onload= function () {
var bodycontent=iframe.contentDocument.body.innerHTML;
console.log(bodycontent);
//處理獲取到的內容；
}
這樣的話基本上可以模擬ajax的操作，實現無刷新提交表單。 完整代碼：
<!DOCTYPE html>
<html lang="en">友肢
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form method="POST" action="./upload.php" enctype="multipart/form-data" target='ifr' id="form1">
<label for="name">name:</label><input type="text" id="name" name="name"/><br/>
<input type="file" name="file" >
<input type="submit" value="提交">
</form>
<iframe name='ifr' id="ifr" style='display: none;'></iframe>
<script>
var iframe=document.getElementById("ifr");
iframe.onload= function () {
var bodycontent=iframe.contentDocument.body.innerHTML;
console.log(bodycontent);
//處理獲取到的內容；
}
</吵告基script>
</body>
</html>
//php代碼
<?php
echo "name:".$_POST['name'].";filename:".$_FILES['file']['name'];
⑶ ajax提交表單上傳文件到servlet中保存如何才能不刷新頁面
可以使用iframe來明鄭實現
這飢態里爛槐源有文章
java">http://blog.csdn.net/zmcmm/article/details/37872097
⑷ jQuery+ajax文件上傳失敗，什麼原因
大部分 都是超出了 伺服器的上傳大小限制
還有就是 ajax 上傳類型是否正確設置 ，類型轉換檢查錯誤沒，示例代碼：
var data = new FormData();
data.append('file', $('input[type=file]')[0].files[0]);
$.ajax({
url: 'ajax.php',
data: data,
processData: false,
type: 'POST'
contentType: 'multipart/form-data',
mimeType: 'multipart/form-data',
success: function (data) {
alert(data);
}
});
⑸ jQuery.form.js 使用ajaxForm、ajaxSubmit提交表單上傳文件後伺服器端返回json數據IE瀏覽器無法解析。
我給你出個招，我在struts1裡面用的很好，你把運行完action得到的json對象保存在session裡面，然後讓這個action跳轉到一個jsp頁面，之後在這個jsp頁面中把他取出來，這樣就可以把json對象傳給ajax了，說明白了嗎？
⑹ 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);//存儲文件
?>
⑺ ajax上傳文件提交時，enctype=multipart/form-data怎麼帶過去
form中的欄位，加上get set方法
private FormFile file;
private String filename;
private String filesize;
action 部分:
public ActionForward execute(ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response)
throws Exception {
String dir="D:/";
UpFileForm uff=(UpFileForm)form;
FormFile file=uff.getFile();
if(file.getFileSize()==0){
return mapping.findForward("success");
}
String fname=file.getFileName();
String size=Integer.toString(file.getFileSize())+"bytes";
InputStream streamIn=file.getInputStream();
OutputStream streamOut=new FileOutputStream(dir+"/"+fname);
int bytesRead=0;
byte[] buffer=new byte[8192];
while((bytesRead=streamIn.read(buffer,0,8192))!=-1){
streamOut.write(buffer,0,bytesRead);
}
streamOut.close();
streamIn.close();
uff.setFilename(fname);
uff.setFilesize(size);
file.destroy();
return mapping.findForward("success");
}
這樣將上傳的文件存在d盤。
⑻ ajax實現文件上傳同時傳一個字元能做到么
用formDate可以；將文件讀入formDate中然後將要加的數據已鍵值對的形式加入formDate；
var formdate=new formDate(document.getElementById('ID').files[0]
);
formdate.append(name:'maomao');
然後將formDate作為數據用ajax發送即可input框里一定要有name屬性哦
⑼ ajax如何 實現 文件上傳
程序說明
使用說明
實例化時，第一個必要參數是file控制項對象：
newQuickUpload(file);
第二個可選參數用來設置系統的默認屬性，包括
屬性: 默認值//說明
parameter:{},//參數對象
action:"",//設置action
timeout:0,//設置超時(秒為單位)
onReady:function(){},//上傳准備時執行
onFinish:function(){},//上傳完成時執行
onStop:function(){},//上傳停止時執行
onTimeout:function(){}//上傳超時時執行
還提供了以下方法：
upload：執行上傳操作；
stop：停止上傳操作；
dispose：銷毀程序。
varQuickUpload=function(file,options){
this.file=$$(file);
this._sending=false;//是否正在上傳
this._timer=null;//定時器
this._iframe=null;//iframe對象
this._form=null;//form對象
this._inputs={};//input對象
this._fFINISH=null;//完成執行函數
$$.extend(this,this._setOptions(options));
};
QuickUpload._counter=1;
QuickUpload.prototype={
//設置默認屬性
_setOptions:function(options){
this.options={//默認值
action:"",//設置action
timeout:0,//設置超時(秒為單位)
parameter:{},//參數對象
onReady:function(){},//上傳准備時執行
onFinish:function(){},//上傳完成時執行
onStop:function(){},//上傳停止時執行
onTimeout:function(){}//上傳超時時執行
};
return$$.extend(this.options,options||{});
},
//上傳文件
upload:function(){
//停止上一次上傳
this.stop();
//沒有文件返回
if(!this.file||!this.file.value)return;
//可能在onReady中修改相關屬性所以放前面
this.onReady();
//設置iframe,form和表單控制項
this._setIframe();
this._setForm();
this._setInput();
//設置超時
if(this.timeout>0){
this._timer=setTimeout($$F.bind(this._timeout,this),this.timeout*1000);
}
//開始上傳
this._form.submit();
this._sending=true;
},
//設置iframe
_setIframe:function(){
if(!this._iframe){
//創建iframe
variframename="QUICKUPLOAD_"+QuickUpload._counter++,
iframe=document.createElement($$B.ie?"<iframename=""+iframename+"">":"iframe");
iframe.name=iframename;
iframe.style.display="none";
//記錄完成程序方便移除
varfinish=this._fFINISH=$$F.bind(this._finish,this);
//iframe載入完後執行完成程序
if($$B.ie){
iframe.attachEvent("onload",finish);
}else{
iframe.onload=$$B.opera?function(){this.onload=finish;}:finish;
}
//插入body
varbody=document.body;body.insertBefore(iframe,body.childNodes[0]);
this._iframe=iframe;
}
},
//設置form
_setForm:function(){
if(!this._form){
varform=document.createElement('form'),file=this.file;
//設置屬性
$$.extend(form,{
target:this._iframe.name,method:"post",encoding:"multipart/form-data"
});
//設置樣式
$$D.setStyle(form,{
padding:0,margin:0,border:0,
backgroundColor:"transparent",display:"inline"
});
//提交前去掉form
file.form&&$$E.addEvent(file.form,"submit",$$F.bind(this.dispose,this));
//插入form
file.parentNode.insertBefore(form,file).appendChild(file);
this._form=form;
}
//action可能會修改
this._form.action=this.action;
},
//設置input
_setInput:function(){
varform=this._form,oldInputs=this._inputs,newInputs={},name;
//設置input
for(nameinthis.parameter){
varinput=form[name];
if(!input){
//如果沒有對應input新建一個
input=document.createElement("input");
input.name=name;input.type="hidden";
form.appendChild(input);
}
input.value=this.parameter[name];
//記錄當前input
newInputs[name]=input;
//刪除已有記錄
deleteoldInputs[name];
}
//移除無用input
for(nameinoldInputs){form.removeChild(oldInputs[name]);}
//保存當前input
this._inputs=newInputs;
},
//停止上傳
stop:function(){
if(this._sending){
this._sending=false;
clearTimeout(this._timer);
//重置iframe
if($$B.opera){//opera通過設置src會有問題
this._removeIframe();
}else{
this._iframe.src="";
}
this.onStop();
}
},
//銷毀程序
dispose:function(){
this._sending=false;
clearTimeout(this._timer);
//清除iframe
if($$B.firefox){
setTimeout($$F.bind(this._removeIframe,this),0);
}else{
this._removeIframe();
}
//清除form
this._removeForm();
//清除dom關聯
this._inputs=this._fFINISH=this.file=null;
},
//清除iframe
_removeIframe:function(){
if(this._iframe){
variframe=this._iframe;
$$B.ie?iframe.detachEvent("onload",this._fFINISH):(iframe.onload=null);
document.body.removeChild(iframe);this._iframe=null;
}
},
//清除form
_removeForm:function(){
if(this._form){
varform=this._form,parent=form.parentNode;
if(parent){
parent.insertBefore(this.file,form);parent.removeChild(form);
}
this._form=this._inputs=null;
}
},
//超時函數
_timeout:function(){
if(this._sending){this._sending=false;this.stop();this.onTimeout();}
},
//完成函數
_finish:function(){
if(this._sending){this._sending=false;this.onFinish(this._iframe);}
}
}
⑽ ajax的res怎麼傳到其他文件
傳其他參豎坦數
ajax文件上傳怎麼傳帶纖臘其他參數,Ajax進行文件與其他參數的上傳功能
光啟元
轉載
關注
0點贊·945人閱讀
記得前一段時間，為了研究Ajax文件上傳，找了很多資料，在網上看到的大部分是form表單的方式提交文件，對於Ajax方式提交文件並且也要提交表單中其他數據，發現提及的並不是很多，後來在同事的幫助下，使用ajaxfileupload最終完成了文件上傳與其他提交的操作，現在分享給大家，希望大家能有有所幫助。本文主要介紹了使用Ajax進行文件與其他參數的上傳功能(java開發),非常不錯，具有參考借鑒價值，需要的朋友參考下吧，希望能幫助到大家。
文件上傳：
操作步驟：
1 導入jar包：
我們在使用文件上傳時，需要使用到兩個jar包，分別是commons-io與commons-fileupload，在這里我使用的兩個版本分別是2.4與1.3.1版本的，需要使用JS文件與jar包最後會發給大家一個連接(如何失效請直接我給留言，我會及時更改，謝謝)。
2 修改配置文件：
當我們導入的jar包是不夠的，我們需要使用到這些jar包，由於我當時使用的是SSM框架，所以我是在application-content.xml中配置一下CommonsMultipartResolver，具體配置方法如下：
104857600
4096
3 JSP文件：
大家對form表單提交問價的方式很熟悉，但是我們有很多情況下並不能直接使用form表單方式直接提交。這時候我們就需要使用Ajax方式提交，Ajax有很多的好處，比如當我們不需要刷新頁面獲希望進行局部蠢滑刷新的時候，我們就可以使用Ajax。