Ajax如何提交数据到springMVC后台

时间：2021-08-08 04:42:27

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

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

本项目目录树：

Ajax如何提交数据到springMVC后台

本项目就一个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的&dollar;http&period;post&lpar;&rpar;提交数据到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注解&commat;RequestMapping取不到参数值解决办法

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

随机推荐

  1. 练习2 练习目标－使用引用类型的成员变量：在本练习中，将扩展银行项目，添加一个（客户类）Customer类。Customer类将包含一个Account对象。

    package banking; public class Customer { private String firstName; private String lastName; private ...

  2. sharepoint2010匿名访问

    怎样在SharePoint 2010网站中启用匿名访问 SharePoint 2010的改动比较大,尤其是相对SharePoint Portal Server 2003来说.本文介绍在SharePoi ...

  3. C语言 gets（）和scanf（）函数的区别

    scanf( )函数和gets( )函数都可用于输入字符串,但在功能上有区别.若想从键盘上输入字符串"hi hello",则应该使用 gets 函数. gets可以接收空格:而sc ...

  4. WinServer2008r2 机器时间格式修改

    windows2008 这么高级的系统不可能改个系统的日期时间显示格式还要进注册表啊.于是有baidu,google了下终于发现了,原来还有不需要注册表的更简便方法.windows2008默认时间格式 ...

  5. 本招聘信息2014年长期有效！杭州派尔科技高薪诚聘android开发（10K-20K），web前端开发（8K-15K），IOS开发（15K-25K）

    杭州派尔科技有限公司发展至今,离不开员工的无私奉献和辛勤耕耘,在努力创造更好成绩的同时,公司也不忘回馈每一位员工的努力与付出.1.全面的绩效考核机制,让发展空间近在眼前!公司力争让每一位员工都了解自己 ...

  6. Apache2&period;2&plus;Tomcat7&period;0整合配置详解

    一.简单介绍 Apache.Tomcat Apache HTTP Server(简称 Apache),是 Apache 软件基金协会的一个开放源码的网页服务器,可以在 Windows.Unix.Lin ...

  7. HTML实体符号

    http://www.php100.com/html/program/html/2013/0903/1052.html

  8. 部署WSP出现错误—已在此服务器场中安装ID为XXXXX的功能

    stsadm -o deploysolution -name ***.wsp -immediate -allowGacDeployment -url http://*** -force   

  9. fatal&colon; You are not currently on a branch&period; 问题解决

    fatal: You are not currently on a branch. 解决 注:亲试,这种方法会把本地的修改给冲掉,所以事先一定要备份下文档,之后覆盖,重新上传或pull即可:解决方法: ...

  10. mui&period;init&lpar;&rpar;和mui&period;plusReady&lpar;&rpar;

    1.每个用到mui的页面都调用下mui.init.2.如果需要使用大H5+对象,就写到plusReady中,如plus对象. HTML5+扩展api是针对手机APP的,只有才手机应用(比如手机浏览器) ...

相关文章