selectbox onchange 이벤트로, 탭메뉴를 동작하게 하려고 하는데.. 가능할까요?
본문
안녕하세요
http://xn--w80by1ax26alkcb1d.com/sub_product.php
여기서 작업중인데,
원래는.. 탭메뉴로, 아래와 같은 구성으로 했었어요
그런데.. 이게 탭메뉴가 너무 많고, 단계가 2단계다 보니
도저히 레이아웃을 못 잡겠더라구요.
그래서... 다음처럼 selectbox 멀티셀렉트로 변경을 하고 있습니다.
그런데..
onchange 로 하다보니
이벤트 발생시마다, 새로고침이 되어서,
내가 원하는 상품을 장바구니에 한번에 못 넣더라구요.
그래서. 생각한게
onchange 이벤트 발생시, 탭메뉴가 동작하게 할수 없을까 입니다.
이론상은 가능할거 같은데,
참고할만한게 있을까요? ㅠ
답변 1
$("select[name=a]").change(
이부분에서
#dynamic_select 이부분 생성 하실때
if(a == '1'){
temp.append('<option value="/sub_product.php?a_no=1&cat_no=11">우성 냉장고</option>');
.....
위에 노란 부분을 추가해서 리프레싱 하면
a 메뉴 생성시 $_GET['a_no'] 로 a 메뉴 디폴트 값을 정의 하면될거같은데요.
근데 더 매끄럽게 하시려면 ajax 로 하시는게 좋을거 같네요.
$(function(){
// bind change event to select
$('#dynamic_select').on('change', function () {
var url = $(this).val(); // get selected value
if (url) {
$(".tabContent").removeClass('active');
$(".tabContent").eq(url).addClass('active');
}
return false;
});
});
고민끝에.. 이렇게 해결했습니다.
노가다끝에 잘 되네요 ;;
http://xn--w80by1ax26alkcb1d.com/sub_product3.php
말씀하신대로 ajax 가 좋은데... 잘 못다루어서 그냥 노가다로.. 처리했네요.
그런데 이제 또 다른 문제는... 2단계 탭을 어찌 처리할건지... 숙제... ㅠ
소중한 답변 감사드립니다.~~
ifraim 활용하는 방법도 고려해 보셔요 .
하시다보면 답이 나올거에요 ~ : )