팁 자료실의 계층적인 셀렉트를 이용해서 검색을 하려고 합니다.

-------------다음은 계층적인 셀렉트를 사용하는 팁자료실의 원글입니다.------------
http://sir.co.kr/bbs/board.php?bo_table=g4_tiptech&wr_id=31172&sca=&sfl=wr_subject%7C%7Cwr_content&stx=%EB%A9%80%ED%8B%B0


------------제가 하려는 것---------------------
계층적인 셀렉트를 이용해서 검색을 하려고 합니다.

------------ 문제점 ---------------------
검색한 후에 2번째 계층의 셀렉트가 풀려버립니다.

------------ 도움을 요청 드리는 것 ---------------------
검색을 한 후에도 2번째, 3번째 계층의 셀렉트가 풀리지 않고 유지될 수 있는 방법을 알려주세요.


<form id="fsearch" name="fsearch" method="get">
<input type="hidden" name="bo_table" value="<?=$bo_table?>">
<input type="hidden" name="sca"      value="<?=$sca?>">
<table>
<tr>
    <th scope="row">교재 프로그램 제목</th>
    <td>
<select name="wr_1" id="combo_0" onChange="change(this)" style="width:100px; color:#5184CD; " class=write_input_select >
<option value="" >선택하세요</option>   
<option value="원과 친구">원과 친구</option>
<option value="봄">봄</option>       
</select>
<select name="wr_2" id="combo_1" onChange="change(this)" style="width:150px; color:#5184CD;" class=write_input_select ><option value="">선택하세요</option>
</select>
</td>
</tr>
<tr>
    <th scope="row">&nbsp;</th>
    <td><input type="image" src="<?=$board_skin_path?>/img/btn_search.gif" border='0' align="absmiddle">
</td>
</tr>
</table>

<script>$("select#combo_0 > option[value=<?=$wr_1?>]").attr("selected", "true");</script>
<script>$("select#combo_1 > option[value=<?=$wr_2?>]").attr("selected", "true");</script>



<script language="Javascript" type="text/javascript">
<!--
// first combo box
data_1 = new Option("원과 친구", "원과 친구");
data_2 = new Option("봄", "봄");


// second combo box
  // 선택1_옵션
data_1_1 = new Option("손을 잡고 놀자", "손을 잡고 놀자");
data_2_1 = new Option("봄이 왔네, 봄이 왔어", "봄이 왔네, 봄이 왔어");
data_2_2 = new Option("봄꽃노래", "봄꽃노래");
 
// other parameters
  displaywhenempty="-선택없음-"
  valuewhenempty=""
  displaywhennotempty="- 항목선택↓  -"
  valuewhennotempty=""

function change(currentbox) {
  numb = currentbox.id.split("_");
  currentbox = numb[1];
  i=parseInt(currentbox)+1
  // I empty all combo boxes following the current one
  while ((eval("typeof(document.getElementById(\"combo_"+i+"\"))!='undefined'")) &&
    (document.getElementById("combo_"+i)!=null)) {
    son = document.getElementById("combo_"+i);
    // I empty all options except the first one (it isn't allowed)
    for (m=son.options.length-1;m>0;m--) son.options[m]=null;
    // I reset the first option
    son.options[0]=new Option(displaywhenempty,valuewhenempty)
    i=i+1
  }

  // now I create the string with the "base" name ("stringa"), ie. "data_1_0"
  // to which I'll add _0,_1,_2,_3 etc to obtain the name of the combo box to fill
  stringa='data'
  i=0
  while ((eval("typeof(document.getElementById(\"combo_"+i+"\"))!='undefined'")) &&
    (document.getElementById("combo_"+i)!=null)) {
    eval("stringa=stringa+'_'+document.getElementById(\"combo_"+i+"\").selectedIndex")
    if (i==currentbox) break;
    i=i+1
  }

  // filling the "son" combo (if exists)
  following=parseInt(currentbox)+1
  if ((eval("typeof(document.getElementById(\"combo_"+following+"\"))!='undefined'")) &&
    (document.getElementById("combo_"+following)!=null)) {
    son = document.getElementById("combo_"+following);
    stringa=stringa+"_"
    i=0
    while ((eval("typeof("+stringa+i+")!='undefined'")) || (i==0)) {
      // if there are no options, I empty the first option of the "son" combo
      // otherwise I put "-select-" in it
      if ((i==0) && eval("typeof("+stringa+"0)=='undefined'"))
      if (eval("typeof("+stringa+"1)=='undefined'"))
        eval("son.options[0]=new Option(displaywhenempty,valuewhenempty)")
      else
        eval("son.options[0]=new Option(displaywhennotempty,valuewhennotempty)")
      else
        eval("son.options["+i+"]=new Option("+stringa+i+".text,"+stringa+i+".value)")
      i=i+1
    }
    //son.focus()
    i=1
    combostatus=''
    cstatus=stringa.split("_")
    while (cstatus[i]!=null) {
      combostatus=combostatus+cstatus[i]
      i=i+1
    }
    return combostatus;
  }
}
//-->
</script>