最近在做毕设遇到一个问题,想在jsp做一个二级联动菜单,功能是通过部门查询部门下的员工,框架用的是ssh,数据交互用的是ajax+json,问题是第一级菜单选择后,第二级菜单没有显示对应的内容。
感觉问题出在json上,因为点击第一级菜单后,jsp调用js中的findEmp()方法到后台,能够查询到departmentdi(部门di)对应的值,但是从action返回值时总是调用了js中的error方法,也就是获取json数据失败。
下面是控制台查询到的数据:
点击第一级菜单选择部门后出现error提示:
jsp:
<select id="departmentid" name="departmentid" onChange="findEmp()">
<option value="0">请选择部门</option>
<c:forEach items="${list2}" var="d">
<option value="${d.departmentid}">${d.departmentname}</option>
</c:forEach>
</select>
<select id="employeeid" name="employeeid">
<option value="0">请选择员工</option>
</select>
js:
<script type="text/javascript">
function findEmp(){
var departmentid=document.getElementById("departmentid").value;
var url="{pageContext.request.contextPath}/ajax_findEmpByDep.action";
$.ajax({
type:"post",
dataType:"json",
data:{departmentid:departmentid},
url:url,
success:function(data){
alert("success");
for(var n=0;n<data.length;n++){
var ids=data[n].id;
var names=data[n].name;
$("#employeeid").append("<option id='"+ids+"' value='"+names+"'>"+names+"</option>");
}
},
error:function(){
alert("failed");
}
})
}
</script>
Action:
public class AjaxAction extends ActionSupport{
private AjaxService ajaxService;
private int departmentid;
private String result;
Department department=new Department();
public void setAjaxService(AjaxService ajaxService) {
this.ajaxService = ajaxService;
}
public int getDepartmentid() {
return departmentid;
}
public void setDepartmentid(int departmentid) {
this.departmentid = departmentid;
}
public String getResult() {
return result;
}
public void setResult(String result) {
this.result = result;
}
public String findEmpByDep(){
//department.getDepartmentid();
System.out.println(departmentid);
List<Employee> empList=ajaxService.findById(departmentid);
Map<String,Object> map = new HashMap<String,Object>();
for(Employee emp:empList){
System.out.println(emp.getEmployeeid());
System.out.println(emp.getEmployeename());
map.put("employeeid", emp.getEmployeeid());
map.put("employeename", emp.getEmployeename());
}
JSONArray json = JSONArray.fromObject(map);
result=json.toString();
return "success";
}
}
struts.xml:
<package name="ajax" namespace="/" extends="struts-default,json-default">
<action name="ajax_*" class="ajaxAction" method="{1}">
<result name="success" type="json">
<param name="root">result</param>
</result>
</action>
</package>
感觉问题出在json上,因为点击第一级菜单后,jsp调用js中的findEmp()方法到后台,能够查询到departmentdi(部门di)对应的值,但是从action返回值时总是调用了js中的error方法,也就是获取json数据失败。
下面是控制台查询到的数据:
点击第一级菜单选择部门后出现error提示:
jsp:
<select id="departmentid" name="departmentid" onChange="findEmp()">
<option value="0">请选择部门</option>
<c:forEach items="${list2}" var="d">
<option value="${d.departmentid}">${d.departmentname}</option>
</c:forEach>
</select>
<select id="employeeid" name="employeeid">
<option value="0">请选择员工</option>
</select>
js:
<script type="text/javascript">
function findEmp(){
var departmentid=document.getElementById("departmentid").value;
var url="{pageContext.request.contextPath}/ajax_findEmpByDep.action";
$.ajax({
type:"post",
dataType:"json",
data:{departmentid:departmentid},
url:url,
success:function(data){
alert("success");
for(var n=0;n<data.length;n++){
var ids=data[n].id;
var names=data[n].name;
$("#employeeid").append("<option id='"+ids+"' value='"+names+"'>"+names+"</option>");
}
},
error:function(){
alert("failed");
}
})
}
</script>
Action:
public class AjaxAction extends ActionSupport{
private AjaxService ajaxService;
private int departmentid;
private String result;
Department department=new Department();
public void setAjaxService(AjaxService ajaxService) {
this.ajaxService = ajaxService;
}
public int getDepartmentid() {
return departmentid;
}
public void setDepartmentid(int departmentid) {
this.departmentid = departmentid;
}
public String getResult() {
return result;
}
public void setResult(String result) {
this.result = result;
}
public String findEmpByDep(){
//department.getDepartmentid();
System.out.println(departmentid);
List<Employee> empList=ajaxService.findById(departmentid);
Map<String,Object> map = new HashMap<String,Object>();
for(Employee emp:empList){
System.out.println(emp.getEmployeeid());
System.out.println(emp.getEmployeename());
map.put("employeeid", emp.getEmployeeid());
map.put("employeename", emp.getEmployeename());
}
JSONArray json = JSONArray.fromObject(map);
result=json.toString();
return "success";
}
}
struts.xml:
<package name="ajax" namespace="/" extends="struts-default,json-default">
<action name="ajax_*" class="ajaxAction" method="{1}">
<result name="success" type="json">
<param name="root">result</param>
</result>
</action>
</package>