JSP 파일에서 `<jsp:include>` 태그를 사용하여 "sample.jsp" 페이지를 포함한 경우 데이터 전달 방법
1. 쿼리 문자열(Query String)로 전달
URL 매개 변수를 사용하여 데이터를 전달할 수 있다. `<jsp:include>` 태그를 사용할 때, `page` 속성의 값 뒤에 쿼리 문자열을 추가
<jsp:include page="sample.jsp?dataFilterName=${dataFilter.DATA_FILTER_NAME}" flush="true"/>
URL에 RequestParameter가 붙어 404에러가 나는 경우
<jsp:include page="sample.jsp">
<jsp:param name="dataFilterName" value="${dataFilter.DATA_FILTER_NAME}" />
</jsp:include>
2. 세션(Session)으로 전달
데이터를 세션에 저장하고 "sample.jsp" 페이지에서 세션에서 해당 데이터 검색 가능
첫 번째 JSP 파일에서 세션에 데이터 저장
<% session.setAttribute("dataFilterName", dataFilter.DATA_FILTER_NAME); %>
3. Request Attribute로 전달
데이터를 요청(request) 속성(attribute)에 저장하고 "sample.jsp" 페이지에서 해당 데이터 검색 가능
첫 번째 JSP 파일에서 요청 속성에 데이터 저장
<% request.setAttribute("dataFilterName", dataFilter.DATA_FILTER_NAME); %>
쿼리 문자열(Query String), 세션(Session), 요청속성(Request Attribute)중 데이터를 전달한 방식에 따라 JSP에서 전달 받은 데이터를 불러온다.
<!-- page -->
<% String dataFilterName = request.getParameter("dataFilterName"); %>
<!-- session -->
<% String dataFilterName = (String) session.getAttribute("dataFilterName"); %>
<!-- attribute -->
<% String dataFilterName = (String) request.getAttribute("dataFilterName"); %>
불러온 값을 JavaScript에서 사용하려면 먼저 위의 전달 받은 데이터를 불러온 후 다음과 같은 방법 중에 사용 가능한 방식을 사용한다.
1. JavaScript의 변수로 할당
<script>
var dataFilterId = '<%= dataFilterId %>';
// 이제 dataFilterId 변수를 JavaScript에서 사용할 수 있습니다.
</script>
2. HTML속성으로 추가
JSP 변수의 값을 HTML 요소의 데이터 속성(attribute)으로 추가하고, JavaScript에서 해당 요소를 찾아 값을 가져옴
<div id="dataFilterElement" data-filter-id="<%= dataFilterId %>"></div>
<script>
var dataFilterElement = document.getElementById('dataFilterElement');
var dataFilterId = dataFilterElement.getAttribute('data-filter-id');
// 이제 dataFilterId 변수를 JavaScript에서 사용할 수 있습니다.
</script>
3. Ajax 요청
필요한 경우 JavaScript에서 서버로 Ajax 요청을 보내어 데이터를 동적으로 가져올 수도 있음
이 방법은 페이지 로딩 후에 데이터를 가져와야 하는 경우에 유용
<script>
var dataFilterName;
// Ajax 요청을 사용하여 dataFilterName 값을 서버에서 가져옵니다.
// $.ajax() 또는 fetch API 등을 사용합니다.
</script>
'Frontend > jQuery & JSTL' 카테고리의 다른 글
[jQuery] ajax를 이용한 Controller로 값 전달 (0) | 2023.10.17 |
---|---|
[jQuery] Uncaught TypeError: Cannot read properties of undefined (reading 'classList') (0) | 2023.10.10 |
modal구현 및 mysql 시분초 변환 (0) | 2023.10.04 |
table data row이벤트 처리 (0) | 2023.09.26 |
[JSTL] jsp를 포함하는 jsp구성 (0) | 2023.09.18 |