SpringMVC+Fastjson+jQuery EasyUI整合

本文来自 布灵格 - SpringMVC+Fastjson+jQuery EasyUI整合

刚刚把这三个组件整合完,记录一下。

  1. 首先要在springMVC.xml中添加如下代码,这样可以让springMVC能够支持Fastjson(spring默认的是Jackson):
<mvc:annotation-driven>
        <mvc:message-converters register-defaults="true">
            <!-- 配置Fastjson支持 -->
            <bean class="com.alibaba.fastjson.support.spring.FastJsonHttpMessageConverter">
                <property name="supportedMediaTypes">
                    <list>
                        <value>text/html;charset=UTF-8</value>
                        <value>application/json</value>
                    </list>
                </property>
                <property name="features">
                    <list>
                        <value>WriteMapNullValue</value>
                        <value>QuoteFieldNames</value>
                    </list>
                </property>
            </bean>
        </mvc:message-converters>
    </mvc:annotation-driven>

详细的可以参考这个文章:
springMVC利用FastJson接口返回json数据相关配置
Fastjson主要是com.alibaba.fastjson.JSON这个类,这个类可以完成很多功能。如:普通的javaBean对象转换为JSONObject对象...

  1. jQuery EasyUI向后台请求datagrid(数据表格)时会传递两个参数:
// datagrid请求数据参数:
page:"1",  //当前页
rows:"10" //数据条数
datagrid请求数据参数

因此,可以根据这两个参数对数据库进行分页查询。

  1. springMVC接收到这两个参数进行处理,从数据库查询出数据
    然后用@ResponseBody注解实现将controller方法返回对象转换为json响应给客户端
Paste_Image.png
@RequestMapping("/bookDate")
    public @ResponseBody JSONObject bookDate() {
        Book book1 = new Book();
        book1.setBookName("java书籍");
        book1.setPrice("¥90");
        book1.setCode("789456312321");
        Book book2 = new Book();
        book2.setBookName("MySQL书籍");
        book2.setPrice("¥45");
        book2.setCode("7894563121456");
        List list = new ArrayList();
        list.add(book1);
        list.add(book2);
        
        // 将普通的javaBean对象转换为 JSONObject 对象
        JSONObject jsonObject1 = (JSONObject) JSONObject.toJSON(book1);
        JSONObject jsonObject2 = (JSONObject) JSONObject.toJSON(book2);

        JSONArray jsonArray = new JSONArray();
        jsonArray.add(jsonObject1);
        jsonArray.add(jsonObject2);

        JSONObject jsonObject = new JSONObject();
        jsonObject.put("rows",jsonArray);
        jsonObject.put("total",2);

        return jsonObject;
    }

注:
jQuery EasyUI需要的是一个JSONObject对象,里面包含rowstotal,因此返回值就可以写上@ResponseBody JSONObject。上面的代码可以体现。

jQuery EasyUI接收数据格式解释

然后就可以在页面显示出来数据了。

页面显示数据
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容