动态实现二级下拉框时的一个奇怪的bug

实现动态下拉框时第一个是公司名称的下拉框，根据选项通过onchange调相应的js动态生成第二个下拉框的部门，但功能还没实现就报了个奇怪的ClassCastException:[Lcom.SixGod.model.Department; cannot be cast to com.SixGod.model.Department
我已经在页面上import Department这个类，为了从Department中取得Department的name，而且能够返回公司的list显示在第一个下拉框中，而session传过来的是一个里面存着List<Department[]>，测试过没有问题。
页面出现类型转换不匹配不知道是js写的不对还是什么别的问题，请各位大虾帮忙了。
附jsp页面代码。<div class="form-row">
<div class="field-label">
<label for="field7">
分公司:
</label>
</div>
<div class="field-widget">
<select  name="comID" id="com"
style="float: left; margin-left: 10px" onchange="getDep()">
<logic:iterate name="comlist" id="dept_id" scope="session">
<OPTION VALUE="0">请选择分公司 </OPTION>
<option id=" ${ dept_id.id }">
<bean:write name="dept_id" property="departmentName" />
</option>
</logic:iterate>
</select>
<div class="field-label">
<label for="field7">
部门:
</label>
</div>
<select id="field7" name="depID"
style="float: left; margin-left: 10px">
<OPTION VALUE="0">请选择相应部门 </OPTION>
</select>
</div>
</div>
<script type="text/javascript">
function getDep() {
var allDeptName = new Array();//把session内的响应对象全部放在
<%for(int i = 0; i<((List<Department>)session.getAttribute("deptlist")).size(); i++) {%>
allDeptName.push(<%=((List<Department>)session.getAttribute("deptlist")).get(i).getDepartmentName()%>);
<%}%> var index = document.getElementById("field7").selectedIndex;//获得选择的公司
var selectedDept = allDeptName[index-1];
for(int i=0; i<selectedDept.length; i++){
var allOption = document.createElement("option");
    allOption.text = selectedDept[i];
    allOption.value = document.getElementById("field7").length+1; 
    document.getElementById("field7").options.add(allOption);
}
}
</script>