zoukankan      html  css  js  c++  java
  • ajax,下拉框级联

    js代码:

    $(document).ready(function() {	
       $("#type1").change(function(){  
          var type1Code=$("#type1").val(); 
          $("#type2").empty();  
          if (type1Code!=0) {  
           $.ajax({  
             type:'post',  
             url:'getType2.action',  
             data:'type1Code='+type1Code,  
             dataType:'json',  
             success:function(json){  
                if(null != json){  
                   $("#type2").append("<option value=''>请选择二级类型</option>");  
                    for(var i=0; i< json.type2List.length;i++){  
                      $("#type2").append("<option value='"  
                       +json.type2List[i].type2Code+"'>"  
                       +json.type2List[i].type2Name+"</option>");  
                    }  
                }   
             },  
             error:function(){        
              alert('取二级类型异常!');        
           }  
          });  
        }else{  
        $("#type2").append("<option value=''>请选择二级类型</option>");  
        }  
        });
    

     jsp代码:

    	<td>
    			一级类型:
    	</td>
    	<td align="left">
    			<s:select id="type1" name="vo.type1" list="vo.type1List"
    				headerKey="0" headerValue="请选择一级类型" listKey="code"
    				listValue="name"></s:select>
    	</td>
    	<td>
    			二级类型:
    	</td>
    	<td align="left">
    			<select id="type2" name="vo.type2">
    				<option value="">
    					请选择二级类型
    				</option>
    			</select>
    	</td>
    

     struts.xml文件配置:

     <package name="plan" extends="base-action" namespace="/plan">
       
             <result-types>
    			<result-type name="json" class="com.googlecode.jsonplugin.JSONResult" />
    		</result-types>
    		<interceptors>
    			<interceptor name="json" class="com.googlecode.jsonplugin.JSONResult" />
    		</interceptors>
    		
    		<action name="getType2" class="planUploadAction" method="getType2">
    		    <interceptor-ref name="ebStackWithoutValidationAndToken" />
    			<result type="json"></result>
    			<result name="input" type="chain">init</result>
    			<result name="invalid.token" type="chain">init</result>
    			<exception-mapping result="success" exception="java.lang.Exception" />
    		</action>
    		
    		。。。。。。
    		
    	</package>
    

     对应action中的方法:

    	/**
    	 * 取二级类型
    	 * @return
    	 */
    	public String getType2(){
    		try{
    			String type1Code=request.getParameter("type1Code");
    			String type2Code="type2_"+type1Code;
    			List<HashMap<String, Object>> lit = new ArrayList<HashMap<String, Object>>();
    			JSONObject json = new JSONObject();
    			HashMap<String, Object> map = new HashMap<String, Object>();
    			//二级类别
    			List<SystemParamVO> type2List=sysParamTypeService.listParamByType(type2Code);
    			for(SystemParamVO type2:type2List){
    				map = new HashMap<String, Object>();
    				map.put("type2Code", type2.getCode());
    				map.put("type2Name", type2.getName());
    				lit.add(map);
    			}
    			json.put("type2List", lit);
    			response.setCharacterEncoding("UTF-8");
    			PrintWriter out = response.getWriter();
    			out.write(json.toString());
    		}catch (Exception e) {
    			log.error(e.getMessage(), e);
    			response.setStatus(500);
    		}
    		return null;
    	}
    
  • 相关阅读:
    OleDbCommand 的用法
    递归求阶乘
    C#重写窗体的方法
    HDU 5229 ZCC loves strings 博弈
    HDU 5228 ZCC loves straight flush 暴力
    POJ 1330 Nearest Common Ancestors LCA
    HDU 5234 Happy birthday 01背包
    HDU 5233 Gunner II 离散化
    fast-IO
    HDU 5265 pog loves szh II 二分
  • 原文地址:https://www.cnblogs.com/gexiaoshan/p/3488856.html
Copyright © 2011-2022 走看看