본문 바로가기

프로그래밍

[javscript/jquery/mybatis] 체크박스를 이용한 데이터 수집과 전송, mybatis의 foreach를 이용한 간단한 where절 만들기

[javscript/jquery/mybatis] 체크박스를 이용한 데이터 수집과 전송, mybatis의 foreach를 이용한 간단한 where절 만들기

웹에서 특정한 체크박스에 있는 속성을 이용해 다른 어디론가 포스트를 한다던지 할때, 
배열형식으로 만들기 전에 체크된 대상들의 정보를 한 뭉치로 묶어서 쓰는 경우가 많습니다.
이렇게 뭉쳐진 내용을 서버 사이드에서 분리/정리할 수도 있지만,
이정도 연산은 클라이언트에서 해결하는 것도 큰 문제가 되진 않으리라 생각되어 
주로 javascript로 처리를 해왔습니다.


우선 이 체크박스들이 class이름은 checks라고 부여하고 value에는 각각의 index가 있다고 가정하겠습니다.
선택된 대상들에 대해서 전송하는 작업을 할 때 체크여부 검사와 필요한 데이터들을 수집할 때 많이 사용했습니다.
이번엔 단순히 출력을 의도로 두고 작업하겠습니다. alert형식으로요.


이런식으로 선택을 하고 어떤 동작(클릭이나 키입력 등)을 실행했을 때 체크박스들을 검사할 함수입니다.

javascript 내용

function  eventOpen()
{
$('.checks').each(function(){
var checkList = "";     
     if($(this).prop(':checked') == true)
     {
          checkList += $(this).val()+"^^";
     }
});

alert(checkList);
}


결과는 예상이 되실 겁니다. 


자 이제 이런 식으로 나온 데이터를 DB에 쓰려고 넣어 볼려고 합니다.
이제 문자열의 끝단을 지워보려합니다.

alert(checkList.replace(/[^]+$/,''));

이런식으로 하면 맨 끝의 "^^"만 날라가게됩니다.

저는 이렇게 선택된 대상들의 index를 where에서 IN 에 쓸 파라미터로 돌릴 껀데,
mybatis를 통해 작업을 해서 <foreach>라는 유용한 문법이 있어서 사용했습니다.

mybatis .xml 내용

<foreach collection='checkList' item='item' index='index' seperator=',' open='(' close=')'>
     #{item}
</foreach>


checkList라는 이름으로 mybatis 동작을 호출할 함수에게 넘길때,
배열 형식으로 만들어서 보내야 정상적으로 동작합니다.

예를 들어 

public void updateList(String checkList, String etc)
{

HashMap<String, Object> hmap = new HashMap<String, Object>();

hmap.put("checkList", checkList.split("^^"));
hmap.put("etc", etc);
prepStmt.sqlSession.update("쿼리객체.업데이트", hmap);

}

이정도의 구조가 되겠지요?
foreach를 돌리기위해서니까 다른데에서 사용하는 것처럼 자료구조형태의 값이 들어가야됩니다.

쿼리에서는 실제로 어떻게 표현될까요?

open에 지정한 (와 close에 지정한 ) 그리고 seperator에서 지정한 ,

이 조합을 통해서 

('2','3','4','6')

이런식으로 찍히게 됩니다. 
WHERE 절에서 IN 연산자의 매개변수로 쓰면 딱이겠지요?