다중 셀렉트(select) 박스 3

1. <FORM name='ff2' METHOD=POST ACTION="">
2. <SELECT NAME="ss1" size=1 onChange='init_list("ff2","ss1","ss2","ss3",1)'>
3.     <option value='0'>대분류</option>
4. </SELECT>
6. <SELECT NAME="ss2" size=1 onChange='init_list("ff2","ss1","ss2","ss3",2)'>
7.     <option >중분류</option>
8. </SELECT>
10. <SELECT NAME="ss3" size=1>
11.     <option >소분류</option>
12. </SELECT>
14. </FORM>
18. <SCRIPT LANGUAGE="JavaScript">
19. <!--
21. /////////////////////////////// 대분류 배열
22. //    Ccode = new Array();
23. //    Cname = new Array();
24.     Ccode = ["0","11","12"]
25.     Cname = ["대분류","비지니스/경제","컴퓨터/인터넷"]
27. ////////////////////////////// 중분류 배열    
29.     Ccode11 = ["0","1111","1112","1113"]
30.     Cname11 = ["중분류","경제1","경제2","경제3"]
31.     Cflag11 = ["0","0","1","1"]
33.     Ccode12 = ["0","1211","1212","1213"]
34.     Cname12 = ["중분류","운영체제","컴퓨터활용","소프트웨어"]
36. ///////////////////////////// 소분류 배열
37.     Ccode1111 = ["0","111111","111112","111113"]
38.     Cname1111 = ["소분류","경제소1","경제소2","경제소3"]
40.     Ccode1112 = ["0","111111","111112","111113"]
41.     Cname1112 = ["소분류","경제소221","경제소222","경제소223"]
43.     Ccode1211 = ["0","111111","111112","111113"]
44.     Cname1211 = ["소분류","윈도우소1","리눅스소2","유닉스소3"]
46.     Ccode1212 = ["0","111111","111112","111113"]
47.     Cname1212 = ["소분류","윈도우소2221","리눅스소2222","유닉스2223"]
50. //////////////////////////////////////////////
51. // ff - 폼이름
52. // ss1 - 대분류 셀렉트박스 이름
53. // ss2 - 중분류 셀렉트박스 이름
54. // ss3 - 소분류 셀렉트박스 이름
55. // gubun - 대분류에서 온 값인지 소분류에서 온 값인지 여부
56. ////////////////////////////////////////////////
58. function init_list(Pform,Pss1,Pss2,Pss3,gubun) {
59. FS1 = eval(Pform + "." + Pss1)
60. FS2 = eval(Pform + "." + Pss2)
61. FS3 = eval(Pform + "." + Pss3)
64. switch(gubun) {
65.     case 1 :
66. // 대분류값이 변하였을 경우
67.      if(FS1.options[FS1.selectedIndex].value != 0 ) {
69.         MCcode = eval( "Ccode" + FS1.options[FS1.selectedIndex].value )
70.         MCname = eval( "Cname" + FS1.options[FS1.selectedIndex].value )
72.         FS2.options.length = Ccode.length
73.         for(i=0 ; i < Ccode.length ; i++) {
74.          FS2.options[i].value = MCcode[i]
75.          FS2.options[i].text = MCname[i]
76.         }
77.      } else {
78.          FS2.options.length = 1
79.          FS2.options[0].value = "0"
80.          FS2.options[0].text = "중분류"
81.      }
82.      break ;
83.     case 2 :
84. // 중분류값이 변하였을 경우
85.      if(FS2.options[FS2.selectedIndex].value != 0 ) {
86.         SCcode = eval( "Ccode" + FS2.options[FS2.selectedIndex].value )
87.         SCname = eval( "Cname" + FS2.options[FS2.selectedIndex].value )
89.         FS3.options.length = Ccode.length
90.         for(i=0 ; i < Ccode.length ; i++) {
91.          FS3.options[i].value = SCcode[i]
92.          FS3.options[i].text = SCname[i]
93.         }
94.      } else {
95.          FS3.options.length = 1
96.          FS3.options[0].value = "0"
97.          FS3.options[0].text = "소분류"        
98.      }
99.      break ;
100.     default :
101. // 초기화 기본값
102.          FS1.options.length = Ccode.length
103.          for(i=0 ; i < Ccode.length ; i++) {
104.             FS1.options[i].value = Ccode[i]
105.             FS1.options[i].text = Cname[i]
106.          }
108.      break ;
109.     }
110. }
112. init_list("ff2","ss1","ss2","ss3",0) ;
113. //-->
114. </SCRIPT>