ajaxservlet上傳
㈠ 如何用ajax上傳文件
引入ajaxfileupload.js
java">jQuery.extend({
createUploadIframe:function(id,uri)
{
//createframe
varframeId='jUploadFrame'+id;
if(window.ActiveXObject){
vario=document.createElement('<iframeid="'+frameId+'"name="'+frameId+'"/>');
if(typeofuri=='boolean'){
io.src='javascript:false';
}
elseif(typeofuri=='string'){
io.src=uri;
}
}
else{
vario=document.createElement('iframe');
io.id=frameId;
io.name=frameId;
}
io.style.position='absolute';
io.style.top='-1000px';
io.style.left='-1000px';
document.body.appendChild(io);
returnio
},
createUploadForm:function(id,fileElementId)
{
//createform
varformId='jUploadForm'+id;
varfileId='jUploadFile'+id;
varform=$('<formaction=""method="POST"name="'+formId+'"id="'+formId+'"enctype="multipart/form-data"></form>');
varoldElement=$('#'+fileElementId);
varnewElement=$(oldElement).clone();
$(oldElement).attr('id',fileId);
$(oldElement).before(newElement);
$(oldElement).appendTo(form);
//setattributes
$(form).css('position','absolute');
$(form).css('top','-1200px');
$(form).css('left','-1200px');
$(form).appendTo('body');
returnform;
},
addOtherRequestsToForm:function(form,data)
{
//addextraparameter
varoriginalElement=$('<inputtype="hidden"name=""value="">');
for(varkeyindata){
name=key;
value=data[key];
varcloneElement=originalElement.clone();
cloneElement.attr({'name':name,'value':value});
$(cloneElement).appendTo(form);
}
returnform;
},
ajaxFileUpload:function(s){
//TODOintroceglobalsettings,,notonlytimeout
s=jQuery.extend({},jQuery.ajaxSettings,s);
varid=newDate().getTime()
varform=jQuery.createUploadForm(id,s.fileElementId);
if(s.data)form=jQuery.addOtherRequestsToForm(form,s.data);
vario=jQuery.createUploadIframe(id,s.secureuri);
varframeId='jUploadFrame'+id;
varformId='jUploadForm'+id;
//Watchforanewsetofrequests
if(s.global&&!jQuery.active++)
{
jQuery.event.trigger("ajaxStart");
}
varrequestDone=false;
//Createtherequestobject
varxml={}
if(s.global)
jQuery.event.trigger("ajaxSend",[xml,s]);
//Waitforaresponsetocomeback
varuploadCallback=function(isTimeout)
{
vario=document.getElementById(frameId);
try
{
if(io.contentWindow)
{
xml.responseText=io.contentWindow.document.body?io.contentWindow.document.body.innerHTML:null;
xml.responseXML=io.contentWindow.document.XMLDocument?io.contentWindow.document.XMLDocument:io.contentWindow.document;
}elseif(io.contentDocument)
{
xml.responseText=io.contentDocument.document.body?io.contentDocument.document.body.innerHTML:null;
xml.responseXML=io.contentDocument.document.XMLDocument?io.contentDocument.document.XMLDocument:io.contentDocument.document;
}
}catch(e)
{
jQuery.handleError(s,xml,null,e);
}
if(xml||isTimeout=="timeout")
{
requestDone=true;
varstatus;
try{
status=isTimeout!="timeout"?"success":"error";
//
if(status!="error")
{
//processthedata()
vardata=jQuery.uploadHttpData(xml,s.dataType);
//Ifalocalcallbackwasspecified,fireitandpassitthedata
if(s.success)
s.success(data,status);
//Firetheglobalcallback
if(s.global)
jQuery.event.trigger("ajaxSuccess",[xml,s]);
}else
jQuery.handleError(s,xml,status);
}catch(e)
{
status="error";
jQuery.handleError(s,xml,status,e);
}
//Therequestwascompleted
if(s.global)
jQuery.event.trigger("ajaxComplete",[xml,s]);
//HandletheglobalAJAXcounter
if(s.global&&!--jQuery.active)
jQuery.event.trigger("ajaxStop");
//Processresult
if(s.complete)
s.complete(xml,status);
jQuery(io).unbind()
setTimeout(function()
{ try
{
$(io).remove();
$(form).remove();
}catch(e)
{
jQuery.handleError(s,xml,null,e);
}
},100)
xml=null
}
}
//Timeoutchecker
if(s.timeout>0)
{
setTimeout(function(){
//
if(!requestDone)uploadCallback("timeout");
},s.timeout);
}
try
{
//vario=$('#'+frameId);
varform=$('#'+formId);
$(form).attr('action',s.url);
$(form).attr('method','POST');
$(form).attr('target',frameId);
if(form.encoding)
{
form.encoding='multipart/form-data';
}
else
{
form.enctype='multipart/form-data';
}
$(form).submit();
}catch(e)
{
jQuery.handleError(s,xml,null,e);
}
if(window.attachEvent){
document.getElementById(frameId).attachEvent('onload',uploadCallback);
}
else{
document.getElementById(frameId).addEventListener('load',uploadCallback,false);
}
return{abort:function(){}};
},
uploadHttpData:function(r,type){
vardata=!type;
data=type=="xml"||data?r.responseXML:r.responseText;
//Ifthetypeis"script",evalitinglobalcontext
if(type=="script")
jQuery.globalEval(data);
//GettheJavaScriptobject,ifJSONisused.
if(type=="json")
{
//,
//youhavetodeletethe'<pre></pre>'tag.
//ThepretaginChromehasattribute,sohavetouseregextoremove
vardata=r.responseText;
varrx=newRegExp("<pre.*?>(.*?)</pre>","i");
varam=rx.exec(data);
//thisisthedesireddataextracted
vardata=(am)?am[1]:"";//theonlysubmatchorempty
eval("data="+data);
}
//evaluatescriptswithinhtml
if(type=="html")
jQuery("<div>").html(data).evalScripts();
//alert($('param',data).each(function(){alert($(this).attr('value'));}));
returndata;
}
})2.引入上傳文件所需的jar
7.獲取之後怎麼處理自己看著辦咯，我只能幫到這里了
㈡ 哪位大俠能告訴我Jquery用AJAX將值傳到Servlet時，Servlet用傳進來的參數輸出EXCEL表格，
jquery ajax 函數的返回類型只有xml、text、json、html等類型，沒有流當然不能下載了
㈢ 用Ajax怎樣和Servlet之間傳輸文本
Ajax 動態無刷新技術 當向後台servlet 傳輸數據是 做相關接受 做完處理之後然後用response 吧你需要的想前台傳輸的數據寫出去 這里 可以寫xml text html 也可以寫json
然後 ajax 傳輸的方法後回調函數 自己用數據接受一下就好了
示例代碼：
$(function(){
$("#button").click(function(
$.post("/login",//傳輸地址接受地址
{name:$("#name").val(),password:$("#password").val()},//傳遞參數
function(data){//回調函數
console.debug(data);
}
})
})
})
㈣ struts2 如何通過ajax上傳文件
ajax是不能上傳文件的，一般做法是使用一個隱藏的iframe 來個傳，達到無刷新上傳的效果。
還有就是使用swf上傳控制項，swfUpload等
㈤ ajax上傳文件，為什麼後台接收的一直為空
寫一個servlet或jsp來接收，在servlet或jsp處理業務邏輯，後返回處理結果或新的數據
如jsp：
<%@ page errorPage="/common/error/error.jsp" %>
<%@ page contentType="text/html;charset=GBK"%>
<%
String planeNumber = request.getParameter("planeNumber");
String planeType = com.aerolink.aocs.system.parameter.list.PlaneTypeFactory.getPlaneType(planeNumber);
response.getWriter().write(planeType);%>
㈥ Java中如何實現Ajax方式上傳圖片
你好，據我所知，Ajax不能上傳圖片，因為上傳圖片得把圖片的二進制數據傳送給WEB伺服器。而Ajax不能完成。
如果樓主指點是無刷新上傳圖片。即不更改當前頁面上傳圖片，利用STRUTS並在HTML頁面中加一個iframe標簽，CSS DISPLAY屬性為NONE 而上傳圖片的表單的TARGET屬性等於這個iframe的名字。
㈦ PHP 如何用ajax做文件上傳
通過傳統的form表單提交的方式上傳文件：
[html] view plain 在CODE上查看代碼片派生到我的代碼片<form id= "uploadForm" action= "http://localhost:8080/cfJAX_RS/rest/file/upload" method= "post" enctype ="multipart/form-data">
<h1 >測試通過Rest介面上傳文件 </h1>
<p >指定文件名： <input type ="text" name="filename" /></p>
<p >上傳文件： <input type ="file" name="file" /></p>
<p >關鍵字1： <input type ="text" name="keyword" /></p>
<p >關鍵字2： <input type ="text" name="keyword" /></p>
<p >關鍵字3： <input type ="text" name="keyword" /></p>
<input type ="submit" value="上傳"/>
</form>
不過傳統的form表單提交會導致頁面刷新，但是在有些情況下，我們不希望頁面被刷新，這種時候我們都是使用Ajax的方式進行請求的。
Ajax的方式進行請求：
[javascript] view plain 在CODE上查看代碼片派生到我的代碼片$.ajax({
url : "http://localhost:8080/STS/rest/user",type : "POST",
data : $( '#postForm').serialize(),
success : function(data) {
$( '#serverResponse').html(data);
},
error : function(data) {
$( '#serverResponse').html(data.status + " : " + data.statusText + " : " + data.responseText);}
});
通常我們提交（使用submit button）時，會把form中的所有表格元素的name與value組成一個queryString，提交到後台。這用jQuery的方法來說，就是serialize。
通過$('#postForm').serialize()可以對form表單進行序列化，從而將form表單中的所有參數傳遞到服務端。
但是上述方式，只能傳遞一般的參數，上傳文件的文件流是無法被序列化並傳遞的。
不過如今主流瀏覽器都開始支持一個叫做FormData的對象，有了這個FormData，我們就可以輕松地使用Ajax方式進行文件上傳了。
關於FormData及其用法
FormData是什麼呢？我們來看看Mozilla上的介紹。
XMLHttpRequest Level 2添加了一個新的介面FormData.利用FormData對象,我們可以通過JavaScript用一些鍵值對來模擬一系列表單控制項,我們還可以使用XMLHttpRequest的send()方法來非同步的提交這個"表單".比起普通的ajax,使用FormData的最大優點就是我們可以非同步上傳一個二進制文件.
所有主流瀏覽器的較新版本都已經支持這個對象了，比如Chrome 7+、Firefox 4+、IE 10+、Opera 12+、Safari 5+。
參見：https://developer.mozilla.org/zh-CN/docs/Web/API/XMLHttpRequest/FormDataConstructor
FormData()
想得到一個FormData對象：
var formdata = new FormData();
W3c草案提供了三種方案來獲取或修改FormData。
方案1：創建一個空的FormData對象，然後再用append方法逐個添加鍵值對：
var formdata = new FormData();
formdata.append("name", "呵呵");
formdata.append("url", "http://www..com/");方案2：取得form元素對象，將它作為參數傳入FormData對象中！
var formobj = document.getElementById("form");var formdata = new FormData(formobj);
方案3：利用form元素對象的getFormData方法生成它！
var formobj = document.getElementById("form");var formdata = formobj.getFormData()
Method
FormData.append
本方法用於向已存在的鍵添加新的值，如該鍵不存在，新建之。
語法
formData.append(name, value);
formData.append(name, value, filename);
注: 通過 FormData.append()方法賦給欄位的值若是數字會被自動轉換為字元(欄位的值可以是一個Blob對象,一個File對象,或者一個字元串,剩下其他類型的值都會被自動轉換成字元串).
參數解釋
name
鍵 (key)， 對應表單域
value
表單域的值
filename (optional)
The filename reported to the server (a USVString), when a Blob or File is passed as the second parameter. The default filename for Blob objects is "blob".
FormData.delete
將一對鍵和值從 FormData 對象中刪除。
formData.delete(username);
FormData.get
返回給定鍵的第一個值
formData.append('username', 'Justin');
formData.append('username', 'Chris');
formData.get(username); // "Justin"
FormData.getAll
返回給定鍵的所有值
formData.append('username', 'Justin');
formData.append('username', 'Chris');
formData.getAll(username); // ["Justin", "Chris"]
FormData.has
檢查是否包含給定鍵，返回 true 或 false
formData.has(username);
FormData.set
設置給定鍵的值
formData.set(name, value);
formData.set(name, value, filename);
瀏覽器兼容情況
來自 MDN：
Desktop
FeatureChromeFirfox(Gecko)Intenet ExplorerOperaSafariBasic support7+4.0(2.0)10+12+5+
append with filename(Yes)22.0(22.0)???
delete, get, getAll, has, setBehind FlagNot supportedNot supported(Yes)Not supportedMobile
FeatureAndroidChrome AndroidFirfox Mobile (Gecko)Firfox OS (Gecko)IE MobileOpera MobileSafari MobileBasic support3.0?4.0(2.0)1.0.1?12+?
append with filename??22.0(22.0)1.2???
delete, get, getAll, has, set(Yes)(Yes)Not supportedNot supportedNot supported(Yes)Not supported2015年06月04日發布
Ajax通過FormData上傳文件
1.使用<form>表單初始化FormData對象方式上傳文件HTML代碼
<form id="uploadForm" enctype="multipart/form-data">
<input id="file" type="file" name="file"/>
<button id="upload" type="button">upload</button>
</form>
javascript代碼
$.ajax({
url: '/upload',
type: 'POST',
cache: false,
data: new FormData($('#uploadForm')[0]),
processData: false,
contentType: false
}).done(function(res) {
}).fail(function(res) {});
這里要注意幾點：
processData設置為false。因為data值是FormData對象，不需要對數據做處理。
<form>標簽添加enctype="multipart/form-data"屬性。
cache設置為false，上傳文件不需要緩存。
contentType設置為false，不設置contentType值，因為是由<form>表單構造的FormData對象，且已經聲明了屬性enctype="multipart/form-data"，所以這里設置為false。
上傳後，伺服器端代碼需要使用從查詢參數名為file獲取文件輸入流對象，因為<input>中聲明的是name="file"。
如果不是用<form>表單構造FormData對象又該怎麼做呢？
2.使用FormData對象添加欄位方式上傳文件
HTML代碼
<div id="uploadForm">
<input id="file" type="file"/>
<button id="upload" type="button">upload</button>
</div>
這里沒有<form>標簽，也沒有enctype="multipart/form-data"屬性。
javascript代碼
var formData = new FormData();
formData.append('file', $('#file')[0].files[0]);$.ajax({
url: '/upload',
type: 'POST',
cache: false,
data: formData,
processData: false,
contentType: false
}).done(function(res) {
}).fail(function(res) {});
這里有幾處不一樣：
append()的第二個參數應是文件對象，即$('#file')[0].files[0]。
contentType也要設置為『false』。
從代碼$('#file')[0].files[0]中可以看到一個<input type="file">標簽能夠上傳多個文件，只需要在<input type="file">里添加multiple或multiple="multiple"屬性。
3.伺服器端讀文件
從Servlet 3.0 開始，可以通過 request.getPart() 或 request.getPars() 兩個介面獲取上傳的文件。
㈧ 如何通過ajax將數據從前台傳到後台
首先貼出來ajax的前台代碼：
function sendData(zxname,begin,end,upordown,dw){
$.ajax({ type : "POST", *以post形式向後台傳遞表單*
url : "smsQueryAllController.do?send",*數據傳輸的目的地址，將在這里對前台數據進行操作*
data :{'zxname':zxname,'begin':begin,'end':end,'upordown':upordown,'dw':dw},*這里是前台傳到後台的數據*
success : function(jsondata) { if(jsondata.success ==true){
alert("success");
}else{
alert("failed"); return false;
}
}, error: function (err) {
alert("提交失敗");
}
});
前台傳輸結束，接著就是後台的接收了，接收是在後台的controller層的smsQueryAllController中的「send」方法中接收處理的（ 「smsQueryAllController.do?send」），接下來是後台的數據處理:
@RequestMapping(params = "send")
@ResponseBody
public List<Highchart> getMsg(HttpServletRequest request, HttpServletResponse response) {
String dw = request.getParameter("dw");
String zxname = request.getParameter("zxname");
String upordown = request.getParameter("upordown");
Date nowDate = new Date();
SimpleDateFormat sdf = new SimpleDateFormat("yyyyMM");
}
在後台通過servlet接收前台的參數，至此前台數據傳到後台，接下來我們就可以在後台添加其他方法對後台數據進行加工！
㈨ 通過AJAX向Servlet里傳輸局中文全是亂碼還有從servlet傳到jsp頁面上的數據也是亂碼。怎麼回事。怎麼解決
ajax在傳遞前先escape一下。把中文轉碼。設置header把編碼和你伺服器要接收的設置一樣。基本上就可以了