现在好多web项目实现前段和后端分离,实现前端和后端技术人员,使他们加快开发,减少沟通上的问题,后台只需要提供访问接口,而前天只需要调用提供的接口即可。减少前后端的沟通上的成本

本项目是开发中发现ajax提交数据产生问题时,写的一个总结。实现ajax的提交数据时的技术问题

本项目目录树:

本项目就一个Controller,AjaxController.java的代码如下:

package com.myshiro.controller;

import java.io.IOException;
import java.util.Date;
import java.util.Iterator;
import java.util.List;
import java.util.Map;
import java.util.Set; import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse; import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody; import com.alibaba.fastjson.JSONObject; @Controller
public class AjaxController { @RequestMapping(value="/ajaxString")
public void a(String sa, String sb, HttpServletRequest request, HttpServletResponse response)
throws IOException{
response.getWriter().println("sa: " + sa + ", sb: " + sb);
} @RequestMapping(value="/ajaxInteger")
public void b(Integer ia, Integer ib, HttpServletRequest request, HttpServletResponse response)
throws IOException{
response.getWriter().println("ia: " + ia + ", ib: " + ib);
} //@RequestBody JSONObject json 把ajax提交的josn参数绑定到JSONObject类型的josn中,可以用来接受List,Map,Date等格式
//然后通过JSONObject的方法进行类型转换
@RequestMapping(value="/ajaxList")
public void d(@RequestBody JSONObject json, HttpServletRequest request, HttpServletResponse response)
throws IOException{
String gid = json.getString("gid");
String myList = json.getString("myList");
//转换成List类型
List<String> myList1 = json.getObject("myList", List.class);
System.out.println(myList1.size()); //转换成Map类型
Map<String, String> myMap = json.getObject("myMap", Map.class);
Set<String> myMapKeySet = myMap.keySet();
for(Iterator<String> iter = myMapKeySet.iterator(); iter.hasNext(); ){
String index = iter.next();
System.out.println("key: " + index + " value: " + myMap.get(index));
} System.out.println(myList);
// response.getWriter().println("gid: " + gid + ", db: " + myList);
response.getWriter().print(json);
}
}

index.jsp前段页面

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<base href="<%=basePath %>">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>ajax测试</title>
</head>
<body> <div>
<button type="button" onclick="ajaxString()">ajaxString</button>
<button type="button" onclick="ajaxInteger()">ajaxInteger</button>
<button type="button" onclick="ajaxList()">ajaxList</button>
</div> <script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript">
function ajaxString(){
$.ajax({
type: 'post',
url: 'ajaxString',
data: {sa: 'ajaxString_a', sb: 'ajaxString_b'},
success: function(res){
alert(res);
}
});
} function ajaxInteger(){
$.ajax({
type: 'post',
url: 'ajaxInteger',
data: {ia: 10010, ib: 10012},
success: function(res){
alert(res);
}
});
} function ajaxList(){
var myList = new Array();
myList[0] = 'parameter_1';
myList[1] = 'parameter_2';
myList[2] = '参数3';
var myMap = {
'key1': 'value1',
'key2': 'value2',
'key3': 'value3'
}
$.ajax({
type: 'post',
url: 'ajaxList',
dataType: 'json', //表示返回值的数据类型
contentType: 'application/json;charset=UTF-8', //内容类型
traditional: true, //使json格式的字符串不会被转码
data: JSON.stringify({gid: 10001, myList: myList, myMap: myMap}),
success: function(res){
alert(res.gid);
alert(res.myList);
}
});
}
</script>
</body>
</html>

本项目实现了ajax提交简单数据,提交jquery数组,字典等数据类型时,springMVC如何接受这些参数

Ajax如何提交数据到springMVC后台的更多相关文章

  1. ajax传递json数据,springmvc后台就收json数据

    1.ajax数据的封装 var json = {"token":token};//封装json数据 $.ajax({ url:'', data:JSON.stringify(jso ...

  2. angular的$http.post()提交数据到Java后台接收不到参数值问题的解决方法

    本文地址:http://www.cnblogs.com/jying/p/6733408.html   转载请注明出处: 写此文的背景:在工作学习使用angular的$http.post()提交数据时, ...

  3. jQuery选取所有复选框被选中的值并用Ajax异步提交数据

    昨天和朋友做一个后台管理系统项目的时候涉及到复选框批量操作,如果用submit表单提交挺方便的,但是要实现用jQuery结合Ajax异步提交数据就有点麻烦了,因为我之前做过的项目中基本上没用Ajax来 ...

  4. from表单提交数据之后,后台对象接受不到值

    如果SSH框架下,前段页面通过from表单提交数据之后,在后台对象显示空值,也就是接收不到值得情况下.首先保证前段输入框有值,这个可以在提交的时候用jQuery的id或者name选择器alert弹出测 ...

  5. AJAX请求提交数据

    1,AJAX准备知识:JSON JSON指的是JavaScript对象表示方法(JavaScript Object Notation) JSON是轻量级的文本数据交换格式 JSON独立于语言 JSON ...

  6. ajax post 提交数据到服务端时中文乱码解决方法

    get 方式提交数据到服务端不会乱码,但对数据量有限制;post 可以提交大数据量,但中文会发生乱码,解决方法: 在JS上用使用 encodeURIComponent 对字符编码处理: student ...

  7. ajax提交数据到java后台,并且返回json格式数据前台接收处理值

    1.前台html页面.有一段代码如下: 账  户:  <input type="text" name="userName" id="userN& ...

  8. ajax 如何提交数据到后台jsp页面,以及提交完跳转到jsp页面

    我logincheck.jsp页面取传参数代码: String user=request.getParameter("user1"); String pwd=request.get ...

  9. Ajax Post提交事例及SpringMVC注解@RequestMapping取不到参数值解决办法

    var xmlHttp; //定义变量,用来创建xmlHttp对象 function ajaxfunction(url,onreadystatechangMethod,param){ // 创建xml ...

随机推荐

  1. [NSConcreteValue doubleValue]: unrecognized selector sent to instance

    今天需求说要给在进入某个页面给某个按钮加上放大效果,心想这还不简单,于是三下五除二的把动画加上提交测试了. 下面是动画的代码 NSTimeInterval time = CACurrentMediaT ...

  2. 感知机分类(perceptron classification)

    概述 在机器学习中,感知机(perceptron)是二分类的线性分类模型,属于监督学习算法.输入为实例的特征向量,输出为实例的类别(取+1和-1). 感知机对应于输入空间中将实例划分为两类的分离超平面 ...

  3. R语言入门 (有其他编程语言基础)

    慢慢才意识到概率统计的重要性,当时学的时候只知道很重要,是机器学习基础啥的,但是却没有真正意识到( ╯□╰ ).我现在的理解是,统计学习可以从大数据中挖掘出规律(其实和数据挖掘还是很相关的),在科研工 ...

  4. Java线程——synachronized关键字的作用(一)

    在并发编程中,多线程同时并发访问的资源叫做临界资源,当多个线程同时访问对象并要求操作相同资源时,分割了原子操作就有可能出现数据的不一致或数据不完整的情况,为避免这种情况的发生,我们会采取同步机制,以确 ...

  5. PAT Advanced 1069 The Black Hole of Numbers (20) [数学问题-简单数学]

    题目 For any 4-digit integer except the ones with all the digits being the same, if we sort the digits ...

  6. day65-CSS选择器和样式优先级

    1. CSS CSS(Cascading Style Sheet,层叠样式表)定义如何显示HTML元素. 当浏览器读到一个样式表,它就会按照这个样式表来对文档进行格式化(渲染). 2.CSS语法 每个 ...

  7. Web API接口

    Web API接口 一.什么是Web API接口 通过网络,规定了前后台信息交互规则的url链接,也就是前后台信息交互的媒介 Web API接口和一般的url链接还是有区别的,Web API接口简单概 ...

  8. 使用Euclid算法求最大公约数

    参考文章 1.<linux c编程一站式学习>的习题5.3.1 2.百度百科Euclid算法:https://baike.baidu.com/item/Euclid%E7%AE%97%E6 ...

  9. scala编程(九)——控制抽象

    减少代码重复 所有的函数都被分割成通用部分,它们在每次函数调用中都相同,以及非通用部分,在不同的函 数调用中可能会变化.通用部分是函数体,而非通用部分必须由参数提供.当你把函数值用做参数时,算法的非通 ...

  10. 如何将本地未提交的更改合并到另一个Git分支?

    如何在Git中执行以下操作? 我当前的分支是branch1,我做了一些本地更改. 但是,我现在意识到我实际上是要将这些更改应用于branch2. 有没有办法应用/合并这些更改,以便它们成为branch ...