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>");
- }
- }
- });
springmvc和js前端的数据传递和接收方式的更多相关文章
- SpringMVC -- 梗概--源码--壹--数据传递
附:实体类 Class : User package com.c61.entity; import java.text.SimpleDateFormat; import java.util.Date; ...
- 关于vue.js父子组件数据传递
vue.js中使用props down,events up的原则进行父子组件间的通信,先来记录下props down,看个例子: <div id="app2"> < ...
- SpringMvc+ajax 实现json格式数据传递
传JSON对象 前端 function test () { var param = {username : "yitop"}; $.ajax({ timeout : 20000, ...
- angular js 指令的数据传递 及作用域数据绑定
<div my-directive my-url="http://google.com" my-link-text="Click me to go to Googl ...
- js前端获取页面传递的参数
转载的,先记下: UrlParm = function () { // url参数 var data, index; (function init() { data = []; index = {}; ...
- 【Android学习】数据传递三种方式
1.Application 注意在清单文件中的Application节点下注册android:name属性, 继承Application类,重写onCreate方法, 使用数据时,实例化自定义类时需要 ...
- api拆分(数据传递和接收的几种方式)
传递方式一:对象转String 接收:String类型接收再转对象 传递方式二:Map 接收:Map 传递方式三:json(Map转json) 接收:String转Map 传递方式四:Map里放jso ...
- 前端mock数据的几种方式
方式 备注 本地php服务架设 直接输出json 使用在线mock服务 如easyMock.apizza.Rap1\2 , 可以远程协作 本地node服务:koa+mongodb 本地node ...
- React中父组件与子组件之间的数据传递和标准化的思考
React中父组件与子组件之间的数据传递的的实现大家都可以轻易做到,但对比很多人的实现方法,总是会有或多或少的差异.在一个团队中,这种实现的差异体现了每个人各自的理解的不同,但是反过来思考,一个团队用 ...
随机推荐
- LeetCode 315. Count of Smaller Numbers After Self
原题链接在这里:https://leetcode.com/problems/count-of-smaller-numbers-after-self/ 题目: You are given an inte ...
- Unity3D研究院之Assetbundle的原理(六十一)
www.xuanyusong.com/archives/2373 Assetbundle 是Unity Pro提供提供的功能,它可以把多个游戏对象或者资源二进制文件封装到Assetbundle中,提供 ...
- (C#)Windows Shell 外壳编程系列2 - 解释,从“桌面”开始展开
(本系列文章由柠檬的(lc_mtt)原创,转载请注明出处,谢谢-) 接上一篇:(C#)Windows Shell 外壳编程系列1 - 基础,浏览一个文件夹 让我们详细解释一下 Shell 编程中最基本 ...
- Sqoop--Free-form Query Imports 自由查询模式下$CONDITIONS关键字的作用
Scoop是用来实现HDFS文件系统和关系型数据库如MySQL之间数据传输和转换的工具. 从MySQL导出到HDFS可以通过--table, --columns and --where等设置数据抽出的 ...
- WebDriver测试web中遇到的弹出框或不确定的页面
我自己是用try catch解决的,不知道其他人的解决方法?如有,可以留言
- PostgreSQL本地化
从管理员的角度描述可用的本地化特性.PostgreSQL支持两种本地化方法:利用操作系统的区域(locale)特性,提供对区域相关的排序顺序.数字格式. 翻译过的信息和其它方面.提供一些不同的字符集来 ...
- web基础 (二) html标签
一.html是什么? 超文本标记语言(Hypertext Markup Language,HTML)通过标签语言来标记要显示的网页中的各个部分.一套规则,浏览器认识的规则 浏览器按顺序渲染网页文件,然 ...
- c# webapi2 实用详解
本文介绍webapi的使用知识 发布webapi的问题 配置问题 webapi的项目要前端访问,需要在web.config配置文件中添加如下配置 在system.webServer节点下面添加 < ...
- delphi 组件安装工具开发
当一个组件的dpk文件数量较多且安装工具不顺手的时候,写一个属于自己的组件安装工具就很有必要了. 本例以 Dev Express 16.1.2 为例,设计一个组件安装工具,以便更深入理解 delphi ...
- delphi 安卓配置教程
本教程以 delphi 10.2.2.2004 为例,演示 delphi 安卓配置步骤 1.打开 Android Tools 2. 选择合适的版本.比如:我的小米4 LTE 是 andorid 6.0 ...