llaay
280
2020-03-16 10:54:13
5
141

[checkbox] DB 값 불러오기 오류가 발생합니다


현재 게시판을 만들고 있습니다!

작성 페이지에서 체크박스를 선택할 때, 배열에 값을 담아 DB 에 저장했습니다!

그리고, 현재 수정페이지에서 배열에 담아 저장했던 값을 불러와 수정페이지를 열 때

체크박스에 체크가 되어있도록 구현하고자 합니다!


수정페이지의 체크박스는 아래와 같이 만들었습니다!

<!-- 테마 선택 -->	
	<div class="custom-control custom-checkbox" align="center" id="the">
		<input type="checkbox" name="theme" class="custom-control-input" value="힐링">
		<label class="custom-control-label" for="jb-checkbox">힐링</label>
		&nbsp; 
		<input type="checkbox" name="theme" class="custom-control-input" value="스냅">
		<label class="custom-control-label" for="jb-checkbox">스냅</label>
		&nbsp; 
		<input type="checkbox" name="theme" class="custom-control-input" value="액티비티">
		<label class="custom-control-label" for="jb-checkbox">액티비티</label>
		&nbsp; 
		<input type="checkbox" name="theme" class="custom-control-input" value="식도락">
		<label class="custom-control-label" for="jb-checkbox">식도락</label>
		&nbsp; 
		<input type="checkbox" name="theme" class="custom-control-input" value="영화">
		<label class="custom-control-label" for="jb-checkbox">영화</label>
		&nbsp; 
		<input type="checkbox" name="theme" class="custom-control-input" value="스포츠">
		<label class="custom-control-label" for="jb-checkbox">스포츠</label>
		
		<input type="hidden" id="board_theme" name="board_theme" value="${bean.board_theme }">
	</div>


그리고 제가 생각한 값을 불러오는 코드입니다

		var theme=$('#board_theme').val();
		var chkbox=$('.custom-control-input');
		
 		theme=theme.split(',');
		
		for(i=0; i<theme.length; i++) {
			alert(theme[i]);
			
			for(j=0; j<chkbox.length; j++) {
				if(theme[i]==chkbox[j].val()) {
					chkbox[j].checked==true;
				}
			}
		}


DB 에 저장된 값을 #board_theme 으로 불러왔고,

해당 값을 split 로 출력했습니다

여기서 체크박스의 value 값과 비교해서 checked 속성을 사용하면 될 거라고 생각했는데,

if(theme[i]==chkbox[j].val()) {


위의 구문에서

58:295 Uncaught TypeError: chkbox[j].val is not a function
    at HTMLDocument.<anonymous> (58:295)
    at fire (jquery-1.12.4.js:3232)
    at Object.fireWith [as resolveWith] (jquery-1.12.4.js:3362)
    at Function.ready (jquery-1.12.4.js:3582)
    at HTMLDocument.completed (jquery-1.12.4.js:3617)


이런 에러가 발생합니다..

선배님들의 조언 부탁드립니다

감사합니다!

0
0
  • 답변 5

  • 강약약강
    59
    2020-03-16 11:06:12

    에러에 잘 나와있네요

    chkbox[j].val() -> chkbox[j].value

    0
  • llaay
    280
    2020-03-16 12:23:34

    강약약강

    [chkbox[j].value] 로 해도 동일한 에러가 납니다ㅠ

    input 의 value 값을 배열 theme 과 비교하고 싶은데, 어떻게 input 의 value 값을 불러올 수 있을까요?

    0
  • 벨제부브
    2k
    2020-03-16 14:15:23
    for(j=0; j<chkbox.length; j++) {
    				if(theme[i]==chkbox[j].val()) {
    					chkbox[j].checked==true;
    				}
    			}
    이부분에 콘솔을 찍어보세요 무슨값이 나오는지만 확인이되면 해결될거같은데요?
    for문바로밑에 chkbox[j].val() console.log 찍어보시고 게대로 값이 도는지 확인해보시고
    theme에서 값이제대로나오는지 확인을해보세요
    그것만하면 해결될거같습니다
    0
  • 강약약강
    59
    2020-03-16 14:22:29 작성 2020-03-16 14:29:09 수정됨

    동일한 에러가 나면 반영이 안된 문제라고 보여지고

    chkbox[j].checked == true -> chkbox[j].checked = true

    비교연산자가 아닌 대입연산자를 사용하셔야 합니다.



    var theme=$('#board_theme').val();
    var chkbox=$('.custom-control-input');
    theme=theme.split(',');
    
    for(i=0; i<theme.length; i++) {
      for(j=0; j<chkbox.length; j++) {
        if(theme[i]==chkbox[j].value) {
          chkbox[j].checked=true;
        }
      }
    }
    


    0
  • llaay
    280
    2020-03-16 14:32:41 작성 2020-03-16 14:33:15 수정됨

    벨제부브 강약약강

    정말정말 감사합니다!

    연산자의 문제였다니... 바로 해결되었습니다, 정말정말 감사합니다!

    더 열심히 공부하도록 하겠습니다!

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