checkbox 클릭시에 form submit 문제요

질문Q #2129

iko2012-12-19 12:24:48

여러 체크박스들이 있구요 서밋버튼 한개 있습니다.

클릭하면 값들이 컨트롤러로 넘어가고 실행되는데요.

이걸 체크박스를 클릭할때마다 서밋이 되도록 만들고 싶은데 어떻게 하는지 모르겠네요..ㅡㅡ;;

$("#checkboxdiv :checkbox").click(function() {

$(this).closest('form').submit();

});

이렇게는 구현이 안되는데 이유가 몬지 모르겠네요.
얼럿을 넣어보면 체크박스 클릭마다 실행이 되는데 왜 폼서밋은 안될까요.
아시는분 부탁드려요. 감사합니다.

답변6

#1 milosz 2012-12-19 12:35:56

$("#checkboxdiv :checkbox").click(function() {

$(this).parents('form:first').submit();

});

그런데 checkbox를 클릭할 때마다 submit이 되는거라면 checkbox를 쓰는건 부적절하다고 생각되네요.

단일 선택지가 필요한 경우는 select나 radio, 클릭할 때 submit이 되어야 한다면 input[type=submit]이나 button[type=submit]을 쓰셔야 UX에 반하지 않습니다.

#2 한대승(불의회상) 2012-12-19 12:37:08

굳이 사용해야 한다면 Ajax로 구현하는게 더 자연 스러울거 같은데요.

#3 iko 2012-12-19 15:50:48

두분 답변 감사드려요.일단 milosz님 코드는 저에겐 잘 안되네요..ㅠㅠlive 나 $("blahform").submit(function(){ 코드 }); checkbox click 후에 trigger구글검색으로 나온코드 별거 다 해봤지만 꿈쩍도 않하네요...ㅎㅎ

ajax로 구현하려면 기존의 컨트롤러 소스를 전부 바꿔야 하지 않을까요...
지금 상황이 카테고리 클릭->모든 제품들이 나오면서 div박스 하나에 클릭한 카테고리와 연관된 모든 서브 카테고리들이 체크박스로 나오는데요 여기서 refine result가 서밋버튼의 형태로만 가능합니다. 그래서 하나씩 체크할때마다 폼서밋이 가능하도록 해보는거에요.
페이지와 다른 자잘한sort 기능도 구현되있는데 ajax로 다시 구현하려면 이거 싹 다 지우고 다시 해야 할까요?ㅋㅋㅋ
디게 머리아프네요....초보의 한계.....ㅋㅋ

#4 iko 2012-12-19 16:29:38

ajax로 폼값을 같이 보내니까 반?은 되네요...ㅋㅋ왜 되다가 안되다가 하는지는 모르겠지만ㅋㅋㅋ
암튼 두분 감사합니다. 복 많이 받으세요 꾸벅

#5 milosz 2012-12-19 17:22:32

음... 새로 불려온 부분이 이벤트가 바인드 되지 않았거나 트리를 잘못 타거나 하는 것 같네요..

#6 iko 2012-12-19 18:04:26

milosz님 말씀이 맞네요.
$.ajax 실행후에 체크박스값이 전송되고 돌아오는 데이타들이 body에 뿌려지기전에 다른 체크박스를 실행하면 안되네요. 많은걸 모르지만 이런건 전혀 몰랐습니다...ㅎㅎ...폼값들이 이미 전송되면 늦더라도 다 돌아오는줄 알았는데..ㅎㅎ 체크박스 실행하자마자 바디에 div하나 올리고 로딩아이콘 띄워서 방지할수 있을거 같에요.
감사합니다~