고등어가어딨니
592
2021-07-05 14:28:06
7
363

스프링 자바스크립트 jstl => 체크박스 체크 표현하기


DB에서 체크박스 값들을 String 값으로 저장하고

다시 DB에서 체크박스 값들을 가져와 html 에  체크박스의 값이 존재하는 체크박스만 

체크해주는걸 구현할려고하는데


우선 저는 이렇게 했습니다

DB에는 이렇게 T , Z , P   3개의 체크박스가 선택된값들을 넣었습니다


그리고 꺼내올 때

문자열을 split으로 쪼개 배열에 넣습니다

그리고 이 배열을 jsp에 넘겨주고

자바스크립트에서 체크할 체크박스들을 정해줍니다


뭔가 복잡한거같아서 그러는데

혹시 더 단순한 방법 있을까요 >??


참고로 php는 이렇게 한번에 되더군요


0
  • 답변 7

  • 에비뉴
    219
    2021-07-05 14:42:04

    스크립트에서 사용하실거고 질문자님이 사용하신 틀을 최대한 유지한다면

    <c:forEach items="${arr}" var="arr">
    	var arr = "${arr}";
    	document.getElementById('+ arr +').checked = true;
    </c:forEach>

    이렇게 사용할 수 있지 않을까요?

  • 고등어가어딨니
    592
    2021-07-05 14:44:59

    와우 이렇게 줄이는 방법도 있엇군요 정말감사합니다 !!

    생각을 좀 더 했어야했는데요 ㅜ,ㅡ 

    혹시 스크립트에서 사용안하고 html 에서 jstl로 바로 사용하는 방법도 있을까요 ??


  • 상저씨
    830
    2021-07-05 14:45:06

    PHP코드 처럼 input tag에서 c:if 로 checked attribute 주시면 되지않을까요?

  • 에비뉴
    219
    2021-07-05 15:17:51 작성 2021-07-05 15:30:56 수정됨

    html에서 jstl로 표현하시려면 DB에서 받은 체크박스 값 이외의 체크박스는 어떻게 처리하실지를 고민해보셔야 할듯 하네요.

    추가적으로 foreach문이 반복문이기 때문에 html에서 체크박스를 foreach 안에서 처리하면 반복문 수 만큼 늘어난다는 것도 고민해보셔야할 부분입니다.

  • 한국은역시자바
    933
    2021-07-05 15:43:01

    <c:forEach var=a items=${as}>

    $("[type='checkbox']").filter("[id=${a}]").prop("checked", true);

  • NULL만나면
    2k
    2021-07-05 15:46:19

    흐음... 이런 방법은 어떨까요?


    ---
    1.jsp
    
    <%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>1</title>
    </head>
    <body>
    	<form action="2.jsp">
    		<span>T</span>
    		<input type="checkbox" name="species" value="T" />
    		
    		<span>Z</span>
    		<input type="checkbox" name="species" value="Z" />
    		
    		<span>P</span>
    		<input type="checkbox" name="species" value="P" />
    		
    		<input type="submit" value="Click" />
    	</form>
    </body>
    </html>
    ---
    2.jsp
    
    <%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
    <%
    	String[] species = request.getParameterValues("species");
    	String result = "";
    	
    	for(int i=0; i<species.length; i++) {
    		result += "," + species[i];
    	}
    	result = result.substring(1, result.length()); // ,T,Z,P -> T,Z,P
    	
    	request.setAttribute("result", result);
    	
    	String next = "3.jsp";
    	RequestDispatcher rd = request.getRequestDispatcher(next);
    	rd.forward(request, response);
    %>
    ---
    3.jsp
    
    <%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
    <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>3</title>
    </head>
    <body>
    	<input type="checkbox" id="T" name="species" value="T" />
    	<input type="checkbox" id="Z" name="species" value="Z" />
    	<input type="checkbox" id="P" name="species" value="P" />
    
    	<script>
    		function init() {
    			var result = '${result}';
    			var arr = result.split(',');
    
    			for(var i=0; i<arr.length; i++) {
    				var one = arr[i];
    				document.getElementById(one).checked = true;
    			}
    		}
    
    		init();
    	</script>
    </body>
    </html>
    ---


  • 고등어가어딨니
    592
    2021-07-05 15:55:42

    와우 감사합니다 여러분 방법은 정말 많군요 ! 

    매우 큰 도움이 되었습니다 

  • 로그인을 하시면 답변을 등록할 수 있습니다.