欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

springmvc和js前端的数据传递和接收方式(两种)

程序员文章站 2024-02-13 19:11:34
在springmvc中controller的结果集可通过json格式传到js前端接受,也可以通过map传给前端,具体实现如下 1,通过json格式传递 contro...

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

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。