출력 예시
선택한 항목에 따라 이미지가 출력되도록 한다.
view 페이지
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>bookTest</title>
<script src="../js/jquery-3.6.4.min.js"></script>
</head>
<body>
<h3>교재 선택</h3>
<select name="book" id="book">
<option>---selection---</option>
<option value="0">spring</option>
<option value="1">android</option>
<option value="2">jquery</option>
<option value="3">javascript</option>
</select>
<br>
<div id="display"></div>
<script>
$("#book").change(function(){
//alert($(this).val());
$.post("booksend.do","book="+ $(this).val(),responseProc);
});
function responseProc(result){
//alert(result);
$("#display").html("<img src='../images/" + result +"'>");
}
</script>
</body>
</html>controller
@Controller
public class BookCont {
/*
http://localhost:9095/book/book.do
*/
public BookCont() {
System.out.println("BookCont() 객체 생성");
}
@RequestMapping("book/book.do")
public String bookTest() {
return "book/bookTest";
}
@RequestMapping("book/booksend.do")
@ResponseBody
public String bookSend(HttpServletRequest req) {
int bookIndex=Integer.parseInt(req.getParameter("book"));
String img[]= {"spring.jpg","android.jpg","jquery.jpg","jsmasterbook.jpg"};
return img[bookIndex];
}
