一web (addjsp)
代碼如下:
<%@page import="com
fingerknow
project
vo
UserInformation"%>
<%@ page language="java" contentType="text/html; charset=utf
"
pageEncoding="utf
"%>
<%@ taglib uri="%>
<c:set var="ctx" value="${pageContext
request
contextPath }" />
<!DOCTYPE html PUBLIC "
//W
C//DTD HTML
Transitional//EN" "
<html>
<head>
<meta http
equiv="Content
Type" content="text/html; charset=utf
">
<title>注冊商圈</title>
<link href="${ctx}/bootstrap/css/bootstrap
css" rel="stylesheet">
<link href="${ctx}/bootstrap/css/bootstrap
responsive
css" rel="stylesheet">
<link rel="stylesheet" href="${ctx}/css/bootstrap
responsive
min
css" />
<link rel="stylesheet" href="${ctx}/css/jquery
ui
css" />
<link rel="stylesheet" href="${ctx}/css/uniform
css" />
<link rel="stylesheet" href="${ctx}/css/select
css" />
<link rel="stylesheet" href="${ctx}/css/unicorn
main
css" />
<link rel="stylesheet" href="${ctx}/css/common
css" />
<%
response
setCharacterEncoding("utf
");//這個是設置編碼方式
response
setContentType("text/html");//這個是設置網頁類型
為文本代碼
UserInformation user=null;
String username="";
Integer userId=null;
if(request
getSession()
getAttribute("userinfo")!=null){
user=(UserInformation)request
getSession()
getAttribute("userinfo");
username=user
getUsername();
userId=user
getUserId();
}else{
username="請<a >登錄</a>";
}
%>
</head>
<body>
<div class="header
inner">
<div class="container">
<div class="row">
<div class=" page
header clearfix">
<div class="span
"> <h
class="page
header" style="background:black;"><img alt="fingerknow" src="${ctx}/images/fingerknow
png" width=""><small>中文最大的購物經驗分享平台</small></h
> </div>
<div class="span
"> <a href="#">首頁</a> |<a href="#">幫助</a></div>
</div>
</div>
</div>
</div>
<div class="container" id="businessEname_div">
<div class="row">
<div class="span
"></div>
<div class="span
">
<div class="widget
box">
<div class="widget
title">
<span class="icon">
<i class="icon
align
justify"></i>
</span>
<h
>注冊商圈</h
>
</div>
<div class="widget
content nopadding">
<form class="form
horizontal" method="post" action="${ctx}/upload/upload
do" id="uploadImgForm" enctype="multipart/form
data">
<div class="control
group" style="border:
px solid red;">
<label class="control
label">*商圈名
</label>
<div class="controls" style="width:
px;border:
px solid red;vertical
align: middle;" >
<input type="text" name="businessName" maxlength="
" id="businessName" width="
px;"/>
<input type="text" name="userId" maxlength="
" value="<%=userId%>" id="userId" width="
px;"/>
<div id="businessName_error" ></div>
</div>
</div>
<div class="control
group">
<label class="control
label">*商圈logo
</label>
<div class="controls" style="width:
px;">
<input type="file" name="file" id="file">
<div id="file_error"></div>
</div>
</div>
<div class="control
group">
<label class="control
label">*商圈英文名
</label>
<div class="controls" style="width:
px;">
<input type="text" name="businessEname" id="businessEname" />
<div id="businessEname_error"></div>
</div>
</div>
<div class="form
actions">
<button type="button" id="imgSave" value="Validate" class="btn btn
primary">提交注冊</button>
</div>
</form>
</div>
</div>
</div>
<div class="span
"></div>
</div>
</div>
<div class="container" style="background:white;">
<div class="row">
<div class="span
" style="margin
left:
%;">
<p>©
fingerknow
com <span>|</span><a href="#" rel="nofollow" >隱私條款</a><span>|</span><a href="#" rel="nofollow">服務條款</a><span>|</span><a href="#" rel="nofollow" >粵ICP備
號
</a></p>
</div>
</div>
</div>
<script src="${ctx}/js/jquery
js"></script>
<script src="${ctx}/js/jquery
form
js"></script>
<script type="text/javascript">
/**
*
* V
*/
$(document)
ready(function() {
//驗證商圈名
$("#businessName")
blur(function(){
var businessName=$("#businessName")
val();
if(businessName!=""){
$("#businessName_error")
html("<img src=
${ctx}/images/success_img
gif
style=
width:
px;height:
px;
/>");
}else{
$("#businessName_error")
attr("class"
"error_div")
html("<img src=
${ctx}/images/error_img
gif
style=
width:
px;height:
px;
/>"+"商圈名不能為空！");
}
});
//驗證商圈英文名
$("#businessEname")
blur(function(){
var businessEname=$("#businessEname")
val();
if(businessEname!=""){
$("#businessEname_error")
html("<img src=
${ctx}/images/success_img
gif
style=
width:
px;height:
px;
/>");
}else{
$("#businessEname_error")
attr("class"
"error_div")
html("<img src=
${ctx}/images/error_img
gif
style=
width:
px;height:
px;
/>"+"商圈英文名不能為空！");
}
});
//圖片上傳 及數據保存
$("#imgSave")
click(function(){
var ext =
jpg
jpeg
gif
bmp
png
;
var f=$("#file")
val();
if (f== "") {//先判斷是否已選擇了文件
$("#file_error")
attr("class"
"error_div")
html("<img src=
${ctx}/images/error_img
gif
style=
width:
px;height:
px;
/>"+"請添加商圈logo！");
return false;
}
f = f
substr(f
lastIndexOf(
) +
)
toLowerCase();
if (ext
indexOf(
+ f +
) ==
) {
$("#file_error")
attr("class"
"error_div")
html("<img src=
${ctx}/images/error_img
gif
style=
width:
px;height:
px;
/>"+"圖片格式不正確！");
return false;
}
var options = {
url: "${ctx}/upload/upload
do"
dataType:
json
contentType: "application/json; charset=utf
"
success: function(data) {
//
data
is an object representing the the evaluated json data
// 如果圖片上傳成功則保存表單注冊數據
if(data
status=="
"){
var fileName=data
fileName;
//alert(fileName);
var businessName=$("#businessName")
val();
var userId=$("#userId")
val();
var businessEname=$("#businessEname")
val();
businessName=encodeURI(businessName);
businessName=encodeURI(businessName);
var urls="${ctx}/business/addBusiness
do?businessName="+businessName+"&businessPic="+fileName+"&businessEname="+businessEname+"&userId="+userId;
$
ajax({
type: "post"
url:urls
dataType: "json"
/*這句可用可不用
沒有影響*/
contentType: "application/json; charset=utf
"
success: function (data) {
if(data
status=="
"){
alert("注冊成功!");
}else{
alert("注冊失敗!原因是
"+data
message);
}
}
error: function (XMLHttpRequest
textStatus
errorThrown) {
alert(errorThrown);
}
});
}else{
$("#file_error")
attr("class"
"error_div")
html("<img src=
${ctx}/images/error_img
gif
style=
width:
px;height:
px;
/>"+data
message);
}
}
};
// 提交表單
$(
#uploadImgForm
)
ajaxSubmit(options);
});
});
</script>
</body>
</html>
二
service(FileUploadController
java
springMVC 之controller層)
代碼如下:
@Controller
@RequestMapping(value = "/upload")
public class FileUploadController {
private Logger logger;
@RequestMapping(value = "upload
do"
method = RequestMethod
POST)
public void fileUpload(HttpServletRequest request
HttpServletResponse response) {
Map<String
Object> resultMap = new HashMap<String
Object>();
String newRealFileName = null;
try {
MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;
CommonsMultipartFile file = (CommonsMultipartFile) multipartRequest
getFile("file");
// 獲得文件名
String realFileName = file
getOriginalFilename();
if(file
getSize()/
>=
*
){
resultMap
put("status"
);
resultMap
put("message"
"圖片不能大於
M");
}else{
System
out
println("獲得文件名
" + realFileName);
newRealFileName = FileUploadController
getNowTime() + realFileName
substring(realFileName
indexOf("
"));
// 獲取路徑
String ctxPath = request
getSession()
getServletContext()
getRealPath("//") + "//temp//";
// 創建文件
File dirPath = new File(ctxPath);
if (!dirPath
exists()) {
dirPath
mkdir();
}
File uploadFile = new File(ctxPath + newRealFileName);
FileCopyUtils
copy(file
getBytes()
uploadFile);
request
setAttribute("files"
loadFiles(request));
resultMap
put("status"
);
resultMap
put("fileName"
newRealFileName);
}
} catch (Exception e) {
resultMap
put("status"
);
resultMap
put("message"
"圖片上傳出錯");
logger
info("***** 圖片上傳出錯 *****");
System
out
println(e);
} finally {
PrintWriter out = null;
try {
out = response
getWriter();
} catch (IOException e) {
e
printStackTrace();
}
//必須設置字符編碼
否則返回json會亂碼
response
setContentType("text/html;charset=UTF
");
out
write(JSONSerializer
toJSON(resultMap)
toString());
out
flush();
out
close();
}
}
}
From:http://tw.wingwit.com/Article/program/Java/JSP/201311/19993.html
