묻고답하기
콤보 박스(드롭다운 메뉴) 안에서 체크 박스를 이용한 다중 선택 기능을 알고 싶어요
2004.07.03 12:10
http://www.danawa.co.kr 에 가보시면
각 제품을 검색할 때에
제조회사, 분류 조건 등의 콤보 박스(드롭 다운 메뉴)가 있는데요,
그 콤보 박스(드롭 다운 메뉴) 안에 각 항목에 체크 박스가 붙어 있어서 복수 선택이 가능하도록 되어 있습니다.
이걸 어떻게 구현할 수 있을지 알고 싶습니다.
많은 분들의 부탁드립니다.
각 제품을 검색할 때에
제조회사, 분류 조건 등의 콤보 박스(드롭 다운 메뉴)가 있는데요,
그 콤보 박스(드롭 다운 메뉴) 안에 각 항목에 체크 박스가 붙어 있어서 복수 선택이 가능하도록 되어 있습니다.
이걸 어떻게 구현할 수 있을지 알고 싶습니다.
많은 분들의 부탁드립니다.
function OneFactorySubmit(intIndexOf, orders)
{
document.left_form.sel_cmpny.value=frmFactoryChk.FactoryChk[intIndexOf].value;
change_sel(orders);
}
<!-- 복수선택 전달 함수 -->
function MutliFactorySubmit(orders)
{
var k;
var isChked;
var strSelectFactory;
isChked = false;
strSelectFactory = "";
for(k=0; k<frmFactoryChk.FactoryChk.length; k++)
{
//frmList.factory.value = "";
if(frmFactoryChk.FactoryChk[k].checked == true)
{
isChked = true;
if (strSelectFactory != "")
{
strSelectFactory = strSelectFactory + "|";
}
strSelectFactory = strSelectFactory + frmFactoryChk.FactoryChk[k].value;
}
}
if(isChked == true)
{
document.left_form.sel_cmpny.value = strSelectFactory;
change_sel(orders);
}
else
{
// 선택이 안될경우 전체 출력
document.left_form.sel_cmpny.value = "all";
change_sel(orders);
}
}
위의 자바스크립트를 살펴보시구요.
콤보박스는 밑의 소스를 보아주세요.
<!-- 콤보 내부 항목 리스트 내용 -->
<table border=0 height=0>
<tr>
<td>
<form name=frmTmpEtc>
<input type=hidden name=ListEtc value=''>
</form>
<form name=frmEtc>
<input type=hidden name=CmpnySelect value='<table width=100% border=0 cellpadding=0 cellspacing=0 style="font-family:돋움; font-size:9pt; border-width:0; border-color:#7F9DB9; border-style:solid;">
<form name=frmFactoryChk>
<tr height=20>
<td colspan=2>
<img src=http://file.danawa.co.kr/all_images/comindex_left_button.gif border=0 onClick=MutliFactorySubmit("cmpny") style=cursor:hand>
</td>
</tr>
<tr height=20>
<td colspan=2 onClick=document.left_form.sel_cmpny.value="all";change_sel("cmpny"); onmouseover=TdMiceOver(this.style); onmouseout=TdMiceOut(this.style); style=cursor:hand>
전체 선택
</td>
</tr>
<tr onmouseover=TdMiceOver(this.style); onmouseout=TdMiceOut(this.style); style=cursor:default>
<td width=12 onmouseover=TdMiceOver(fac_0.style); onmouseout=TdMiceOut(fac_0.style); style=cursor:default>
<input type=checkbox name=FactoryChk value=AMD>
</td>
<td width=110 id=fac_0 onClick=frmFactoryChk.FactoryChk[0].checked=true;OneFactorySubmit(0,"cmpny") onmouseover=TdMiceOver(this.style); onmouseout=TdMiceOut(this.style); style=cursor:hand>
AMD </td>
</tr>
<tr onmouseover=TdMiceOver(this.style); onmouseout=TdMiceOut(this.style); style=cursor:default>
<td width=12 onmouseover=TdMiceOver(fac_1.style); onmouseout=TdMiceOut(fac_1.style); style=cursor:default>
<input type=checkbox name=FactoryChk value=INTEL>
</td>
<td width=110 id=fac_1 onClick=frmFactoryChk.FactoryChk[1].checked=true;OneFactorySubmit(1,"cmpny") onmouseover=TdMiceOver(this.style); onmouseout=TdMiceOut(this.style); style=cursor:hand>
INTEL </td>
</tr>
<tr height=20>
<td colspan=2 onClick=document.left_form.sel_cmpny.value="all";change_sel("cmpny"); onmouseover=TdMiceOver(this.style); onmouseout=TdMiceOut(this.style); style=cursor:hand>
전체 선택
</td>
</tr>
<tr>
<td colspan=2>
<img src=http://file.danawa.co.kr/all_images/comindex_left_button.gif border=0 onClick=MutliFactorySubmit("cmpny") style=cursor:hand>
</td>
</tr>
</form>
</table>
스크립트랑, 콤보쪽을 보시면 아실듯 합니다.