Ajax动态刷新 级联刷新

2022-04-12 10:21:59


1.jsp页面

首先是两个下拉框，当公司名字变动时会场负责人的选择列表也相应变换

[html] view plaincopyprint?
  1. <tr>  
  2.         <td width="50%" bgcolor="#EAF6EA">  
  3.          <div align="right">  
  4.           公司名：  
  5.          </div>  
  6.         </td>  
  7.         <td bgcolor="#FFFFFF">  
  8.          <s:select list="comInfolist" listValue="Com_name"  
  9.           listKey="Com_id" name="Com_id" value="%{mai.comId}" id="com" onchange=<span style="color:#ff0000">"finduserlst1();"</span>></s:select>  
  10.          <label style="color: red;">  
  11.   
  12.          </label>  
  13.         </td>  
  14.        </tr>  
  15. <tr>  
  16.         <td width="50%" bgcolor="#EAF6EA">  
  17.          <div align="right">  
  18.           会场负责人：  
  19.          </div>  
  20.         </td>  
  21.         <td bgcolor="#FFFFFF">  
  22.          <input type="hidden" id="user_id" value="${mai.responsibleId}"/>  
  23.          <input type="hidden" id="user_name" value="${mai.responsibleName}"/>  
  24.          <select id="comuser" name="comusername" style="width: 150px" >  
  25.   
  26.          </select>  
  27.   
  28.          <label style="color: red;">  
  29.   
  30.          </label>  
  31.   
  32.         </td>  
  33.        </tr>  

2.js

js的方法中首先获得选中框的值，也就是公司id。使用了json，data处为传值。


[javascript] view plaincopyprint?
  1.         function finduserlst1(){  
  2. //获取下拉框的选中项  
  3. var checkText=$("#com").find("option:selected").val();  
  4.   
  5. $("#comuser").empty();  
  6. if(checkText==""){  
  7.     $("#comuser").append("<option value=''>----请选择----</option>");  
  8. }else{    
  9.   $.ajax({  
  10.    url:"<span style="color:#ff0000">companymanage!findPeopleByComId.do</span>",  
  11.    type:"post",  
  12.    dataType:"<span style="color:#ff0000">json</span>",  
  13.    data:{<span style="color:#ff0000">comID:checkText</span>},  
  14.    success:function(json){  
  15.           
  16.        $("#comuser").append("<option value=''>----请选择----</option>");  
  17.         
  18.         
  19.        $.each(json, function(i){    
  20.            $("#comuser").append("<option value='"+json[i].userid+"'>"+json[i].realName+"</option>");  
  21.              
  22.        });  
  23.       
  24.    },  
  25.    
  26.     error:function (XMLHttpRequest, textStatus, errorThrown){  
  27.       
  28.       return false;  
  29. }  
  30.   
  31. });   
  32. }  
  33. }  

3.java方法


然后是action中，首先获得传来的comId.之后是方法。注意这里的需要一个inputstream，不然会报错。这里的comID对应上面json处data所传的值。

[html] view plaincopyprint?
  1. private String comID;  
  2. private List<User_info> userlist;  
  3. private InputStream inputStream;  
  4.   
  5. public String findPeopleByComId() {  
  6.   
  7.         System.out.println("进入了根据公司的id查询所有的人");  
  8.         userlist = meetingAddrInfoService.findPeopleByComId(Integer  
  9.                 .parseInt(comID));  
  10.         String jsonString = JSONArray.fromObject(userlist).toString();  
  11.         try {  
  12.             inputStream = new ByteArrayInputStream(jsonString.getBytes("UTF-8"));  
  13.         } catch (UnsupportedEncodingException e) {  
  14.             // TODO Auto-generated catch block  
  15.             e.printStackTrace();  
  16.         }  
  17.         return "searchUser";  
  18.   
  19.         // System.out.println("根据公司id查询所有人：" + userlist + comID);  
  20.   
  21.     }  
  22.   
  23.     public InputStream getInputStream() {  
  24.         return inputStream;  
  25.     }  
  26.   
  27.     public void setInputStream(InputStream inputStream) {  
  28.         this.inputStream = inputStream;  
  29.     }  
  30.   
  31. <span style="white-space:pre">  </span>public List<User_info> getUserlist() {  
  32.         return userlist;  
  33.     }  
  34.   
  35.     public void setUserlist(List<User_info> userlist) {  
  36.         this.userlist = userlist;  
  37.     }  
  38.   
  39. <span style="white-space:pre">  </span>public String getComID() {  
  40.         return comID;  
  41.     }  
  42.   
  43.     public void setComID(String comID) {  
  44.         this.comID = comID;  
  45.     }  

4.配置

struts2里的配置如下

[html] view plaincopyprint?
  1. <!-- json的配置 -->  
  2.    <action name="companymanage" class="com.hb.action.system.MeetingAddrInfoAction" method="{1}">  
  3.     <result name="searchUser" type="stream">  
  4.                 <param name="contentType">text/json</param>  
  5.                 <param name="inputName">inputStream</param>  
  6.             </result>  
  7.    </action>  

上一篇：PostgreSQL 内存OOM控制策略导致数据库无法启动的诊断一例(如何有效避免oom)


下一篇：AgileX开发者社区上线｜邀您共建全球机器人“企、校、研”新生态