(Ajax, Spring 기반) 동적 콤보박스

동적 콤보박스~
왠만한 개발자들 다 해본걸텐데 난 html 화면단 작업을 별로 안해봐서 이번에 첨 해본다^^

HTML

<!-- EVENT -->

<script type="text/javascript">

$(function(){

...........

$("select#srchInstKind").change(function(){

$.getJSON("<c:url value='/backend/cmCode/CmCode_GetList.json'/>",{srchCodeKind: 'AUTH_KIND', srchInstKind: $('#srchInstKind').val()}, function(j){

var options = '<option value="">--All--</option>';

for (var i = 0; i < j.length; i++) 

{

options += '<option value="' + j[i].code + '">' + j[i].codeNm + '</option>';

}

$("#srchAuthKind").html(options);

$('#srchAuthKind option:first').attr('selected', 'selected');

});

});

});

</script>

srchInstKind 콤보박스 onChange시에 srchAuthKind 콤보박스를 리로딩 한다.

Spring Controller

......

import org.codehaus.jackson.map.ObjectMapper;

......

@Controller

public class CmCodeController {

......

    @RequestMapping(value="/backend/cmCode/CmCode_GetList.json")

    public ResponseEntity<String> getListJson(HttpServletRequest request

    , HttpServletResponse response

    ,@RequestParam(value="srchCodeKind",required=false) String srchCodeKind

,@RequestParam(value="srchCodeUseYn",required=false) String srchCodeUseYn

,@RequestParam(value="srchInstKind",required=false) String srchInstKind

    ) throws Exception {

   

    CmCode cond = new CmCode();

   

    cond.setCodeKind(StringUtil.fixNull(srchCodeKind));

   

    if(StringUtil.fixNull(srchCodeUseYn) != "") 

    {

    cond.setCodeUseYn(srchCodeUseYn);

    }

    else

    {

    cond.setCodeUseYn("Y");

    }

   

    cond.setInstKind(StringUtil.fixNull(srchInstKind));

   

   

    List<CmCode> list = cmCodeService.selectListMainCol(cond);

   

    ObjectMapper om = new ObjectMapper();

   

    String jsonString = om.writeValueAsString(list);

   

//     logger.debug("jsonString:----------------------------\n" + jsonString + "\n-------------------------------");

        // Below 3 Lines Make Hangul Printing Correct!!          

        HttpHeaders responseHeaders = new HttpHeaders();

        responseHeaders.add("Content-Type", "text/html; charset=UTF-8");

        return new ResponseEntity<String>(jsonString, responseHeaders, HttpStatus.CREATED);

    }    

}

※ 참고 1

@ResponseBody 한글깨짐 처리

아래 두 개 블로그 글 덕분에 잘 구현했음^^

http://blog.naver.com/dvorzark/40106410412

http://pcycom.tistory.com/entry/jquery-json-%EC%9D%84-%EC%82%AC%EC%9A%A9%ED%95%9C-dynamic-select-box-%EB%8F%99%EC%A0%81-%EC%85%80%EB%A0%89%ED%8A%B8-%EB%B0%95%EC%8A%A4

※ 기타 서핑하면서 본 정보들 (참고하지는 않음)

http://www.techiegyan.com/2008/07/26/jquery-handling-html-select/

이건 별로 라이브러리 이용해서 쓰는건데, 콤보박스 이래저래 핸들링 할 일 있을때 쓰면 괜찮을듯합니다.

난 지금 필요없으므로 패쑤