Controller에서 넘긴 Model 값 JavaScript에서 사용하기

public void list(Criteria cri ,Model model)

Controller에서 select 한 값이라거나 map, list 등을 Model에 담아서 값을 보내줄 수 있다.

 

저 값들을 View(jsp)단에서는 

<!-- val : map에 담은 변수(컬럼)명 -->
<input type="text" name="name" value="<c:out value="${list.val}"/>">

이렇게 불러올 수 있다,

 

하지만 JavaScript 단에서 Model값을 불러와야 한다면?

같은 jsp 소스 내에 위치하고 있다고 하더라도 jstl,el 은 서버단에서 동작하고 JavaScript는 브라우저에서 실행된다. 그렇기 때문에 두 언어 간에 변수를 주고받을 수 없어서 난감한 상황이였다.

불러오는 데이터가 1건밖에 없다면 JavaScript에서 var value = "${list.val}"; 이런식으로 해서 이미 불러왔을 것이다.

하지만 list, map 형식으로 model에 담겨와 여러 row가 존재하고 key값도 여러개라면 참 난처해진다.

이럴 때는

/* JavaScript 내에서 jstl을 사용할 수 있다. jstl 선언해주는 것 잊지말기! */
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

/* JavaScript 태그 및 함수 등등 생략하고 필요한 부분에서 forEach 사용하기 */

	 var bno = [];
	<c:forEach items="${list}" var="feq">
	// JavaScript 배열에 값을 추가하기 위해서는 push() 함수를 사용해야 한다.
	bno.push("${feq.bno}");
	</c:forEach>​

이렇게 JavaScript에서 jstl을 사용하여 변수에 담는 방법을사용했다.

forEach로 루프를 돌려서 차례대로 list나 object, 또는 변수에 담아서 알맞게 사용하면된다.