SpringMVC与JQuery EasyUI DataGrid传递JSON数据

最新推荐文章于 2023-02-03 10:39:26 发布

一枚小蔡鸡

最新推荐文章于 2023-02-03 10:39:26 发布

阅读量1.7k

点赞数

分类专栏：本科小编程文章标签： spring mvc easyui json

本文链接：https://blog.csdn.net/caipengbo/article/details/60323136

版权

本科小编程专栏收录该内容

6 篇文章 0 订阅

订阅专栏

本文默认您会使用EasyUI, 仅仅讲解如何通过SpringMVC与EasyUI DataGrid传递数据。
思路是：Handler Method返回JSONObject对象，SpringMVC对此对象进行转换。

Jar包

以下所有Jar包，均可以在我的CSDN资源里下载

首先是Java操作json的类的相关jar包：

commons-beanutils-1.9.2.jar
commons-collections-3.2.1.jar
commons-lang-2.4.jar
commons-logging-1.1.3.jar’
ezmorph-1.0.6.jar
json-lib-2.3-jdk15.jar

Spring MVC 结果转换jar包：

jackson-annotations-2.8.0
jackson-core-2.8.1
jackson-databind-2.8.7

配置文件

<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:mvc="http://www.springframework.org/schema/mvc"
  xmlns:context="http://www.springframework.org/schema/context"
     xmlns:aop="http://www.springframework.org/schema/aop"
       xsi:schemaLocation="http://www.springframework.org/schema/beans
        http://www.springframework.org/schema/beans/spring-beans-3.1.xsd
        http://www.springframework.org/schema/mvc
        http://www.springframework.org/schema/mvc/spring-mvc-3.1.xsd
        http://www.springframework.org/schema/context
        http://www.springframework.org/schema/context/spring-context-3.1.xsd
        http://www.springframework.org/schema/aop
        http://www.springframework.org/schema/aop/spring-aop-3.1.xsd
        http://www.springframework.org/schema/tx">

    <!-- 组件扫描 只扫描action -->
    <context:component-scan base-package="cn.caipengbo.action" />
    <!--注解映射器 -->
     <bean class="org.springframework.web.servlet.mvc.method.annotation.RequestMappingHandlerMapping" />
    <!--注解适配器 -->
    <bean  class="org.springframework.web.servlet.mvc.method.annotation.RequestMappingHandlerAdapter">
    <property name="messageConverters">
        <!-- 添加对JSON的支持-->
        <list>
            <bean
                  class="org.springframework.http.converter.json.MappingJackson2HttpMessageConverter" />
        </list>
    </property>
    </bean>

    <!-- 视图解析器 解析jsp视图-->
    <bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
        <!-- 逻辑视图名 -->
        <!-- 视图的前缀, 路径的前缀 -->
        <property name="prefix" value="/WEB-INF/pages/" />
        <!-- 视图的后缀 -->
        <property name="suffix" value=".jsp" />
    </bean>

</beans>

POJO

package cn.caipengbo.domain;

/**
 * Created by Myth on 3/3/2017.
 */
public class Student {
    private String name;
    private int age;
    public Student(String name,int age) {this.name = name; this.age = age;}

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public int getAge() {
        return age;
    }

    public void setAge(int age) {
        this.age = age;
    }
}

控制器类

@Controller
public class Json {
    @RequestMapping("/outputJson")
    @ResponseBody
    public Object outputJson() {
        Student user1 = new Student("test1",10);
        Student user2 = new Student("test2",20);
        List<Student> users = new ArrayList<Student>();
        Map<String,Object> jsonMap = new HashMap<String,Object>();
        users.add(user1);
        users.add(user2);
        jsonMap.put("rows",users);
        jsonMap.put("total",users.size());
        JSONObject jsonObject = JSONObject.fromObject(jsonMap);
        System.out.println(jsonObject);
        return jsonObject;
    }
}

Web前端

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>测试JSON</title>
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/style/easyui.css">
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/style/icon.css">
    <script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery.min.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery.easyui.min.js"></script>
</head>
<body>
<table id="dg" title="My Users" class="easyui-datagrid" style="width:550px;height:250px"
       url="${pageContext.request.contextPath }/outputJson.action"
       rownumbers="true"
       fitColumns="true"
       singleSelect="true">
    <thead>
    <tr>
        <th field="name" width="50">Name</th>
        <th field="age" width="50">Age</th>
    </tr>
    </thead>
</table>
</html>

测试结果

这里写图片描述

相关代码您也可以去我的GitHub上下载，如有其它疑问，欢迎留言！！

一枚小蔡鸡

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
SpringMVC与JQuery EasyUI DataGrid传递JSON数据

本文默认您会使用EasyUI, 仅仅讲解如何通过SpringMVC与EasyUI DataGrid传递数据。思路是：Handler Method返回JSONObject对象，SpringMVC对此对象进行转换。Jar包以下所有Jar包，均可以在我的CSDN资源里下载首先是Java操作json的类的相关jar包：commons-beanutils-1.9.2.jarcommons-collec
复制链接

扫一扫