동적 select

<script language="javascript">
	
	function changeDeptList(){
		var selectedSchoolId=document.getElementById("schoolName").selectedIndex ;
		var selectedSchoolName=document.getElementById("schoolName")[selectedSchoolId].value;
		var length = document.getElementById("departmentName").options.length;
			for (var index=0; index<length; index++){ 
			 	document.getElementById("departmentName").remove(0); 
		}
		 var deptList=new Array();

			<c:forEach var="x" items="${departmentList}">
				
				if("${x.schoolName}"== selectedSchoolName){
					<c:forEach var="y" items="${x.departmentNameList}">
						deptList.push("${y}");
					</c:forEach>
				}
			</c:forEach>
			var i=0;
				for(i=0; i<deptList.length; i++){	
					var departmentOption= new Option(deptList[i],deptList[i]);
					document.getElementById("departmentName").options.add(departmentOption);
				}
	}
</script>

<select name="schoolName" id="schoolName" onchange="changeDeptList()" >
	<option value="0">단과대학을 고르세요</option>
	<c:forEach var ="x" items="${departmentList}" >
		<option value="${x.schoolName}">
			${x.schoolName}
		</option>
        </c:forEach> 
</select>