Rumah > hujung hadapan web > tutorial js > JavaScript Ajax Json实现上下级下拉框联动

JavaScript Ajax Json实现上下级下拉框联动

高洛峰
Lepaskan: 2016-11-26 16:23:36
asal
1170 orang telah melayarinya

最近尝试做出一个部门和人员的下拉框联动功能,部门和人员的对应关系是1:N

[html] 

部门
 

   

 

       

   

 

 

人员
 

   

 

     

   

 

 

部门下拉框的onchange()事件走一个AJAX方法,返回一个JSON对象(JSON里放的是个LIST)。

js方法在此页面的写法:

[javascript] 

 

此处返回的data里包含list(list见后文),list里包含着人员的代码,人员的姓名两个属性。然后先把人员下拉框empty(),通过select控件append方法 添加新的下拉框元素。

后台代码:

[java]  

public String departmentChangeEvent() throws Exception{  

        userList=service.queryForList("Workorder.queryUserByDepartmentCode", departmentCode);  

        if(userList!=null&&userList.size()>0)  

        {  

            HttpServletResponse response = ServletActionContext.getResponse();  

            response.setContentType("text/html;charset=utf-8");  

            response.setHeader("Pragma","No-cache");  

            response.setHeader("Cache-Control","no-cache");  

            response.setHeader("Cache-Control", "no-store");  

            PrintWriter writer = response.getWriter();  

            JSONObject json = new JSONObject();  

            Map map = new HashMap();  

               map.put("list",userList);  

               JSONObject jso = JSONObject.fromObject(map);  

            writer.write(jso.toString());  

            writer.flush();  

            writer.close();     }  

            return null;    

   }    

 

这个方法是部门切换事件,通过departmentCode(field域,有set,get)来求的当前部门下的用户放到userList中。www.2cto.com

然后通过标准写法把userList放到一个定义好的HashMap中,KEY为list。

[java] 

JSONObject jso = JSONObject.fromObject(map);  

这是最为关键的一步,有的json对象创建方法也可以为JSONObject jso = new JSONObject() ; 然后把list里的记录放入到jso中。。。

在这里是行不通的,前台会认为返回的是个字符串。。。

struts中 返回类型为json

[html]  

  

       

      

         


Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan