springmvc和js前端的数据传递和接收方式

    在springmvc中controller的结果集可通过json格式传到js前端接受,也可以通过Map传给前端,具体实现如下


1,通过json格式传递

   controller层实现如下

   

 @RequestMapping("queryCityInfo")
	@ResponseBody
	public String queryCityInfo()throws Exception{
		 String provinceId = getString("id");
		 @SuppressWarnings("rawtypes")
		List cityList = personalService.queryCity(provinceId);
         if(null != cityList && cityList.size() >0 ){
        	String json = JSONUtils.toJSONString(cityList);       	
        	super.outStr(json);
         }
		return null;
	}


protected void outStr(String str)</span>
	{
		try
        {
            response.setCharacterEncoding("UTF-8");
            response.getWriter().write(str);
        }
        catch (Exception e)
        {
        }
	}
public static <T> String toJSONString(List<T> list)
	{
		JSONArray jsonArray = JSONArray.fromObject(list);
		
		return jsonArray.toString();
	}



  js端接受如下

  

function selectBankCity(id){
	
	$.ajax({
		url:baseAddress+"queryCityInfo.do?provinceId="+id,
		type:'get',
		dataType:'json',
		success:function(data){
			$('#custBankArea').empty();
			$('#custBankArea').append("<option >--请选择城市信息--</option>");
			for(var i=0;i<data.length;i++){
				$('#custBankArea').append("<option value='"+data[i].id+"'>"+data[i].cityName+"</option>");
			}
		}
	});
}

2,通过Map传递

controller层实现如下

@RequestMapping("queryProvince")
	@ResponseBody
	public Map<String, Object>  queryProvince(HttpServletRequest request,HttpServletResponse response){
		Map<String, Object> map = new HashMap<String, Object>();
		try {
			@SuppressWarnings("rawtypes")
			List provinceList = personalService.queryProvince();
			if(null != provinceList && provinceList.size() >0 ){
				map.put("province", provinceList);
	        } 
		} catch (Exception e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
		return map;
	}

js端接受如下

$.ajax({
			url:baseAddress+"queryProvince.do",
			type:"get",
			success:function(resData){
				var data = resData.province;
				for(var i=0;i<data.length;i++){
					//js实现
					//var objs = document.getElementById("cusBankCity")
					//objs.options.add(new Option(data[i].provinceName) ,data[i].id);
					//jq实现
					$("#cusBankCity").append("<option value='"+data[i].id+"'>"+data[i].provinceName+"</option>");
				}
			}
		});


   

  • 2
    点赞
  • 12
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值