스프링에서 간단히 데이터를 입력이 필요해져서 간단히 만들어보았다.
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>${title}</title>
<script src="http://code.jquery.com/jquery.js"></script>
</head>
<body>
<header><h1>${title}</h1></header>
<form method="post" enctype="multipart/form-data">
<fieldset>
<table>
<tr height="50">
<th>Name</th>
<td><input type="text" name="name" required="required" placeholder="name"></td>
</tr>
<tr height="50">
<th>ImageFile</th>
<td><img id="image_view" width = 200> <br/> <input type="file" name="imageFile" required="required" onchange="fileSelect(this);" > </td>
</tr>
<tr>
<td colspan="1">
<input type="submit" value="올리기">
</td>
</tr>
</table>
</fieldset>
</form>
<script>
function fileSelect(input) {
if (input.files[0] && input.files) {
var reader = new FileReader();
reader.onload = function (e) {
$('#image_view').attr('src', e.target.result);
};
reader.readAsDataURL(input.files[0]);
}//end if
}//end fileChange Method
</script>
</body>
</html>
'Development > Web & Server' 카테고리의 다른 글
[Javascript] String 파싱 (0) | 2014.04.03 |
---|---|
Ajax를 이용해서 Multipart Form Data 전송하기 (0) | 2014.04.02 |
[Spring Framework] AWS EC2에 설치되어 있는 MongoDB 원격 연결하기 (0) | 2014.03.24 |
[Hibernate] Embedded 사용하기 (0) | 2014.03.24 |
[Spring Framework] jsp에서 리소스를 로딩할때.... 경로 설정하는 방법 (0) | 2014.03.20 |