发现spring 3已经对ajax支持的很好了,前端可以只使用html+jquery,后端 
只使用spring再加上一种orm,两者之间用json交换数据就可以了,现在是放弃 
jsp,struts这些已经显得累赘的技术的时候了。 
出于这种想法,我做了个小试验,其中之所以选择jquery 1.3.2是因为jquery 
ui 1.8还不是稳定版,而稳定版1.7是基于jquery 1.3+的。

1. 先从前台提交数据开始,关键代码如下: 
Javascript代码 
function save() {   
    var elemUserinfo = $('#customerInfo');   
    var userinfo = elemUserinfo.serializeObject();   
    var jsonuserinfo = JSON.stringify(userinfo);   
       
    jQuery.ajax({   
        type : 'POST',   
        contentType : 'application/json',   
        url : 'customerInfo/new.do',    
        data : jsonuserinfo,   
        dataType : 'json',   
        success : function(data){   
            $('div#responseName').text(data.name);   
            $('div#responseAddr').text(data.addr);   
        },   
        error : failed   
    });   
}  
其中customerInfo是一个form的id,该form包含两个text input,name分别为name和addr, 
serializeObject是一个网上比较流行的将form数据组装成json对象的juery扩展,代码如下: 
Javascript代码 
$.fn.serializeObject = function() {   
    var o = {};   
    var a = this.serializeArray();   
    $.each(a, function() {   
        if (o[this.name]) {   
            if (!o[this.name].push) {   
                o[this.name] = [ o[this.name] ];   
            }   
            o[this.name].push(this.value || '');   
        } else {   
            o[this.name] = this.value || '';   
        }   
    });   
    return o;   
};  
将json对象转成String是用的json2(http://www.json.org/js.html)的JSON.stringify,提交 
是用的jquery的ajax功能,注意要把contentType设为'application/json',这是为了后台spring 
将其自动转化为vo对象用的。 
关于返回值后面再说。

2. 然后说说后台spring的接收。 
后台主要的代码如下: 
Java代码 
@Controller  
@RequestMapping("/customerInfo")   
public class CustomerInfoController {   
       
    @RequestMapping(value="/new", method = RequestMethod.POST)   
    @ResponseBody  
    public Customer newCustomer(@RequestBody Customer customer) {   
        customer.setName(customer.getName() + "经服务器修改");   
        customer.setAddr(customer.getAddr() + "经服务器修改");   
           
        return customer;   
    }   
}  
其中Controller,RequestMapping什么的就不多说了,简单的说就是前提交时指定的url( 
customerInfo/new.do)就被spring转到这里来处理了,其中web.xml中spring的设置如下: 
Xml代码 
<servlet>  
    <servlet-name>test</servlet-name>  
    <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>  
    <load-on-startup>1</load-on-startup>  
</servlet>  
  
<servlet-mapping>  
    <servlet-name>test</servlet-name>  
    <url-pattern>*.do</url-pattern>  
</servlet-mapping>  
注意处理申请的函数的参数直接就是Customer对象(Customer是一个具有属性name和addr的vo), 
而不是json字串,这里的关键是这样的,spring具有将数据转化后再交给controller的功能,spring 3 
新增了对json的处理能力,是基于Jackson JSON Processor(http://jackson.codehaus.org/)的, 
使用时要配置一下,在这个例子中默认的bean定义文件test-servlet.xml中这样写: 
Xml代码 
<bean  
    class="org.springframework.web.servlet.mvc.annotation.AnnotationMethodHandlerAdapter">  
    <property name="messageConverters">  
        <util:list id="beanList">  
            <ref bean="mappingJacksonHttpMessageConverter" />  
        </util:list>  
    </property>  
</bean>  
  
<bean id="mappingJacksonHttpMessageConverter"  
    class="org.springframework.http.converter.json.MappingJacksonHttpMessageConverter" />  
这样一来,spring在接收contentType为application/json的request时会自动将json字串间转换成期望 
的java对象,同样,发送response时,contentType被设为application/json,并且将java对象转为json 
字串。

3. 下面该说返回了 
上面已经说到,spring自动将response进行json化,所以处理函数直接返回vo对象就可以了。 
而在页面端,由于我们指定了dataType为json,所以jquery直接把接收到的json字串转成了javascript 
对象,我们可以直接使用data.name的写法取得数据了。

简单吧,这样一来,开发中,可以由设计人员在需求分析的基础上专心用html制作页面,之后交到前端 
开发人员手里,前端开发人员添加js代码,实现页面逻辑,后台人员专心于java,spring和orm,前后 
端交换json数据就可以了。

jquery(1.3.2)<--json-->spring(3.0)的更多相关文章

  1. Jquery跨域获得Json

    这两天用 Jquery 跨域取数据的时候,经常碰到 invalid label 这个错误,十分的郁闷,老是取不到服务器端发送回来的 json 值, 一般跨域用到的两个方法为:$.ajax 和$.get ...

  2. 通过Jquery中Ajax获取json文件数据

    1. JSON(JavaScript Object Notation): javaScript对象表示法: 是存储和交换文本信息的语法,比xml更小,更快,更易解析. 2. JSON基本书写格式 : ...

  3. jquery ajax调用返回json格式数据处理

    Ajax请求默认的都是异步的 如果想同步 async设置为false就可以(默认是true) var html = $.ajax({ url: "some.php", async: ...

  4. (转)springMVC框架下JQuery传递并解析Json数据

    springMVC框架下JQuery传递并解析Json数据 json作为一种轻量级的数据交换格式,在前后台数据交换中占据着非常重要的地位.Json的语法非常简单,采用的是键值对表示形式.JSON 可以 ...

  5. spring boot2.0(一 ) 基础环境搭建

    1.基础配置 开发环境:window jdk版本:1.8(spring boot2.0最低要求1.8) 开发工具:eclipse 构建方式:maven3 2.POM配置文件 <project x ...

  6. 通过JQuery的$.ajax()把 json 数据 post 给 PHP

    通过JQuery的$.ajax()把 json 数据 post 给 PHP时的几种情况: 无法在PHP中通过$_POST 以及 $_REQUEST 获取json数据,即 $json = $_POST[ ...

  7. Spring Boot2.0 整合 Kafka

    Kafka 概述 Apache Kafka 是一个分布式流处理平台,用于构建实时的数据管道和流式的应用.它可以让你发布和订阅流式的记录,可以储存流式的记录,并且有较好的容错性,可以在流式记录产生时就进 ...

  8. spring boot 2.0(一)权威发布spring boot2.0

    Spring Boot2.0.0.RELEASE正式发布,在发布Spring Boot2.0的时候还出现一个小插曲,将Spring Boot2.0同步到Maven仓库的时候出现了错误,然后Spring ...

  9. 【MVC model 验证失效 】【Unexpected token u in JSON at position 0】【jquery-plugin-validation】

    问题描述:mvc model 调用jquery-plugin-validation 实现 前台的数据验证,时报错 Unexpected token u in JSON at position 0 很讨 ...

  10. Spring Boot2.0之 监控管理

    Spring boot监控中心: 针对微服务的服务状态,服务器的内存变化(内存.线程.日志管理等)检测服务配置连接地址是否有用(有些懒加载的情况下,用的时候发现卧槽不能用)模拟访问,懒加载.统计有多少 ...

随机推荐

  1. AFNetworking2.4.1 解析

    http://wenku.baidu.com/view/6ec734a84028915f814dc26d.html

  2. init: Associated with Deployer 'Catalina:type=Deployer,host=localhost'

     四月 12, 2014 1:54:12 上午 org.apache.catalina.core.ApplicationContext log信息: HTMLManager: init: Associ ...

  3. 微信公众号与HTML 5混合模式揭秘2——分享手机相册中照片

    本书是分享微信jssdk开发的第二篇.     4.2.1 项目需求 需求说明:实现微信端的手机用户,点击按钮选取1张图片,分享到朋友圈. 4.2.2 需求分解 通过对需求的了解,可以将其分解为: ( ...

  4. 你应该知道的9个优秀的CSS框架

    前端开发是一项非常繁琐的工作,你不仅需要拥有和别人不一样的审美观和设计观,而且需要了解诸如HTML.CSS.JavaScript等错综复杂的技术,因此选择一些优秀的CSS框架或许可以帮助你大大提高工作 ...

  5. 炫酷实用的jQuery插件 涵盖菜单、按钮、图片

    新的一周开始了,今天我们要为大家分享一些全新的jQuery插件和HTML5/CSS3应用,这些jQuery插件不仅非常炫酷,而且还挺实用,这次的分享包含jQuery菜单.CSS3按钮已经多种图片特效, ...

  6. codevs 3185 队列练习1

    题目描述 Description 给定一个队列(初始为空),只有两种操作入队和出队,现给出这些操作请输出最终的队头元素. 操作解释:1表示入队,2表示出队 输入描述 Input Description ...

  7. c语言 char*类型作为中间变量将许多字符串保存到一个数组的问题

    char*是一个字符串指针,如下面的程序value_作为一个中间变量用来在for循环中scanf输入的值的接收者,然后将value_保存到array中,但是一下程序会出现一个问题就是当你跳出这个函数时 ...

  8. AnyCAD脚本模型

    采用AnyCAD建立的模型, 基于AnyCAD.Net SDK在C#中展示模型:

  9. Android开发代码规范

    目录 1.命名基本原则  2.命名基本规范 2.1编程基本命名规范 2.2分类命名规范 3.分类命名规范 3.1基本数据类型命名规范 3.2控件命名规范 3.3变量命名规范 3.4整个项目的目录规范化 ...

  10. ubuntu bash提示找不到文件或目录

    我在ubuntu上安装好后交叉编译器,用tab键也可以找到这个交叉编译器,但执行的时候总是提示:bash:xxx找不到文件或目录. 解决方法:安装lib32z1 命令:apt-get install ...