springmvc와 js 프론트엔드의 데이터 전송 및 수신 방법(두 가지)

Spring MVC에서 controller의 결과 집합은 json 형식으로 js 프론트엔드에 전달될 수 있으며, 또한 Map을 통해 프론트엔드에 전달할 수 있습니다. 구체적인 구현은 다음과 같습니다.

1json 형식으로 전달됩니다.

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");-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#63;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>); 
      }; 
    }; 
  }); 
}; 

2Map을 통해 전달됩니다

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>); 
        }; 
      }; 
    }); 

이것이 이 문서의 전체 내용입니다. 여러분의 학습에 도움이 되길 바랍니다. 또한, 노래 교육에 많이 지지해 주시기 바랍니다.

선언: 이 문서의 내용은 인터넷에서 가져왔으며, 저작권자는 본사에 있습니다. 내용은 인터넷 사용자가 자발적으로 기여하고 업로드한 것이며, 사이트는 소유권을 가지지 않으며, 인공적인 편집을 하지 않았으며, 관련 법적 책임도 부담하지 않습니다. 저작권 위반 내용을 발견하면 이메일을 보내 주시기 바랍니다: notice#oldtoolbag.com에 이메일을 보내면 (#을 @으로 변경하세요) 신고하시고 관련 증거를 제공하시면, 사이트는 즉시 위반 내용을 삭제합니다.