2단 셀렉트박스
본문
셀렉트 박스를 하나 선택했을때
2차 셀렉트 박스에서 값을 다르게 주고싶습니다.
ajax로 표현하려니까 뭔가가 안맞더라구여
손쉬운 방법이없을까요?
답변 2
2차 셀렉트박스 값변하는 2단 셀렉트 박스입니다
<ul>
<li>
<select name="BDIV" id="ctg" class="sel_cate" onchange="fnCngList(this.value);">
<option value="">대분류</option>
<option value="B1">분류1</option>
<option value="B2">분류2</option>
<option value="B3">분류3</option>
</select>
</li>
<li>
<select name="SDIV" id="ctg_nm" class="sel_list">
<option value="">소분류</option>
</select>
</li>
</ul>
function fnCngList(sVal){
var f = document.form1;
var opt = $("#ctg_nm option").length;
if(sVal == "") {
num = new Array("소분류");
vnum = new Array("");
}else if(sVal == "B1") {
num = new Array("분류1-1","분류1-2","분류1-3");
vnum = new Array("1-1","1-2","1-3");
}else if(sVal == "B2") {
num = new Array("분류2-1","분류2-2","분류2-3");
vnum = new Array("2-1","2-2","2-3");
}else if(sVal == "B3") {
num = new Array("분류3-1","분류3-2","분류3-3");
vnum = new Array("3-1","3-2","3-3");
}
for(var i=0; i<opt; i++) {
f.SDIV.options[0] = null;
}
for(k=0;k < num.length;k++) {
f.SDIV.options[k] = new Option(num[k],vnum[k]);
}
}
배열을 wr_no로 처리하시면 될것같네요
블로그참고
출처: .blog.naver.com/PostView.nhn?blogId=cancoffee81&logNo=220053682363
<HTML>
<HEAD>
<TITLE>BLUEB</TITLE>
<script language="JavaScript"><!--
a1 = new Array( "news_media",
"건강_의학",
"연예오락예술",
"사회문화",
"교육_자료",
"컴인터넷",
"비지니스경제",
"레크리에션",
"과학학문",
"스포츠",
"지역정보",
"그밖에");
suba = new Array();
suba["메인카타고리 선택"] = new Array("메인카타고리를 선택하세요.");
suba["news_media"] = new Array( "방송",
"신문",
"잡지",
"라디오",
"인터넷방송",
"저널사설",
"컴퓨터뉴스",
"언론저널",
"대학교",
"날씨",
"tv",
"sports");
suba["건강_의학"] = new Array( "간호학",
"건강관리",
"의학",
"질병증상",
"치의학",
"한의학",
"공중위생",
"전통의학",
"약학",
"세미나",
"여성임신",
"금연",
"병원",
"응급치료",
"잡지",
"연구소");
suba["연예오락예술"] = new Array( "배우탈란트",
"애니메이션",
"영화",
"음악",
"만화",
"디자인",
"유머",
"공연예술",
"건축",
"공예",
"시각예술",
"전통예술",
"박물관화랑",
"예술가");
suba["사회문화"] = new Array( "노동",
"박물관",
"법",
"사회과학",
"음식요리",
"유머",
"정부정치",
"문화",
"동문친목회",
"인간관계",
"환경",
"범죄",
"기관단체",
"식음료");
suba["교육_자료"] = new Array( "대학대학원",
"취업",
"도서관",
"특허",
"고등교육",
"직업교육",
"기관단체",
"유아교육",
"초중교육");
suba["컴인터넷"] = new Array( "인터넷",
"비지니스",
"보안암호",
"software",
"hardware",
"www",
"programing",
"os",
"컴예술",
"컴공학",
"홈만들기",
"멀티미디어",
"자료",
"뉴스");
suba["비지니스경제"] = new Array( "금융투자",
"무역",
"건설",
"경제학",
"기계",
"도서",
"중소기업",
"산업용품",
"의류",
"정보통신",
"미용",
"광고",
"회사",
"부동산");
suba["레크리에션"] = new Array( "공예",
"레저",
"스포츠",
"동물",
"유머",
"자동차",
"취미",
"게임",
"여행",
"레저");
suba["과학학문"] = new Array( "공학",
"물리학",
"농학",
"사회과학",
"생물학",
"인문과학",
"천문학",
"컴공학",
"수학",
"화학",
"통계학",
"환경학");
suba["스포츠"] = new Array( "낚시",
"농구",
"무술",
"스키",
"야구",
"축구",
"등산",
"골프",
"기타");
suba["지역정보"] = new Array( "국가별",
"한국시도",
"세계지역");
suba["그밖에"] = new Array( "생활여성",
"쇼핑",
"취업정보");
function view_cat1(inForm) {
inForm.cat1.options.length = a1.length + 1;
inForm.cat1.options[0] = new Option("1차선택", "notset", true, false);
for (var i = 1; i <= a1.length; i++) {
inForm.cat1.options[i] = new Option(a1[i-1]);
}
}
function view_cat2(inForm) {
var s = inForm.cat1.options[inForm.cat1.selectedIndex].text;
inForm.cat2.options.length = suba[s].length + 1;
inForm.cat2.options[0] = new Option("2차항목", "notset", true, false);
for (var i = 1; i <= suba[s].length; i++) {
inForm.cat2.options[i] = new Option(suba[s][i-1]);
}
}
//-->
</script>
</HEAD>
<body onLoad=view_cat1(window.document.Form)>
<FORM name=Form>
<select name=cat1 onChange=view_cat2(this.form)>
<option>1차선택</option>
</select>
<select name=cat2>
<option>2차항목</option>
</select>
</BODY>
</HTML>
답변을 작성하시기 전에 로그인 해주세요.