[Spring, Thymeleaf] Ajax로 얻은 Response가 화면에 나오지 않습니다...
-
게시물 수정 , 삭제는 로그인 필요
![](https://img-api.cboard.net/img_n.php?image_url=https://kin-phinf.pstatic.net/20220303_206/1646300047190TAv9n_JPEG/1.jpg)
안녕하세요 스프링 배우고 있는 학생입니다.
제작하고 있는 프로젝트가 회원마다 카테고리와 상품이 달라서
Ajax로 클릭한 상품에 대한 옵션을 불러오는 기능을 만들고 있습니다.
그런데, 옵션 정보를 model로 보내는 것까진 성공해서 사진과 같이 Response엔 잘 나오는데
화면에는 나오지 않습니다ㅠㅠ
어떻게 해결해야 할까요?? 아래에 코드 올려놨습니다!
HTML
<div id="optionAjax">
<div class="col" th:if="${options} != null" th:each="olist : ${options}">
<div class="card shadow-sm">
<img th:if="${olist.optionImage == null}" class="card-img-top" src="static/image/noImage.png" height="225" alt=" Card image cap">
<img th:if="${olist.optionImage != null}" class="card-img-top" th:src="'static/image/'+${loginUser.userNum}+'/'+${olist.optionImage}" height="225" alt=" Card image cap">
<div class="card-body">
<h5 class="text-center fw-bold" th:text="${olist.optionName}">err</h5>
<h5 class="text-center fw-bold text-primary" th:text="${olist.optionPrice} + ' 원'">err</h5>
</div>
</div>
</div>
</div>
AJAX
function callOption(pid) {
$.ajax({
url : "callOption",
dataType : "json",
contentType : "application/json; charset=UTF-8",
type : "post",
data : JSON.stringify({productId:pid}),
}).done(function (fragment) {
$("#optionAjax").replaceWith(fragment);
});
}
컨트롤러
@PostMapping(value = "/callOption")
public String callOption(@RequestBody Map<String, Object> map, HttpServletRequest request, Model model){
HttpSession session = request.getSession();
User loginUser = (User) session.getAttribute("loginUser");
List<Option> options = optionService.getOptionByProductIdAndUserNum(Long.valueOf(map.get("productId").toString()), loginUser.getUserNum());
model.addAttribute("options", options);
System.out.println(options.toString());
return "kiosk/kiosk :: #optionAjax";
}
![](https://img-api.cboard.net/img_n.php?image_url=https://kin-phinf.pstatic.net/20220303_206/1646300047190TAv9n_JPEG/1.jpg)
![](https://img-api.cboard.net/img_n.php?image_url=https://kin-phinf.pstatic.net/20220303_15/1646300047331TlM2A_JPEG/2.jpg)
안녕하세요 스프링 배우고 있는 학생입니다.
제작하고 있는 프로젝트가 회원마다 카테고리와 상품이 달라서
Ajax로 클릭한 상품에 대한 옵션을 불러오는 기능을 만들고 있습니다.
그런데, 옵션 정보를 model로 보내는 것까진 성공해서 사진과 같이 Response엔 잘 나오는데
화면에는 나오지 않습니다ㅠㅠ
어떻게 해결해야 할까요?? 아래에 코드 올려놨습니다!
HTML
<div id="optionAjax">
<div class="col" th:if="${options} != null" th:each="olist : ${options}">
<div class="card shadow-sm">
<img th:if="${olist.optionImage == null}" class="card-img-top" src="static/image/noImage.png" height="225" alt=" Card image cap">
<img th:if="${olist.optionImage != null}" class="card-img-top" th:src="'static/image/'+${loginUser.userNum}+'/'+${olist.optionImage}" height="225" alt=" Card image cap">
<div class="card-body">
<h5 class="text-center fw-bold" th:text="${olist.optionName}">err</h5>
<h5 class="text-center fw-bold text-primary" th:text="${olist.optionPrice} + ' 원'">err</h5>
</div>
</div>
</div>
</div>
AJAX
function callOption(pid) {
$.ajax({
url : "callOption",
dataType : "json",
contentType : "application/json; charset=UTF-8",
type : "post",
data : JSON.stringify({productId:pid}),
}).done(function (fragment) {
$("#optionAjax").replaceWith(fragment);
});
}
컨트롤러
@PostMapping(value = "/callOption")
public String callOption(@RequestBody Map<String, Object> map, HttpServletRequest request, Model model){
HttpSession session = request.getSession();
User loginUser = (User) session.getAttribute("loginUser");
List<Option> options = optionService.getOptionByProductIdAndUserNum(Long.valueOf(map.get("productId").toString()), loginUser.getUserNum());
model.addAttribute("options", options);
System.out.println(options.toString());
return "kiosk/kiosk :: #optionAjax";
}
#spring thymeleaf 설정 #spring thymeleaf dependency #spring thymeleaf layout #spring thymeleaf maven #spring thymeleaf template #spring thymeleaf css #spring thymeleaf redirect #spring thymeleaf cache #spring thymeleaf react #spring thymeleaf model