第一种方式:直接返回JSON数据

package com.easyuijson.util;

import java.text.SimpleDateFormat;
import net.sf.json.JsonConfig;
import net.sf.json.processors.JsonValueProcessor; public class DateJsonValueProcessor implements JsonValueProcessor{ private String format; public DateJsonValueProcessor(String format){
this.format = format;
} public Object processArrayValue(Object value, JsonConfig jsonConfig) {
return null;
} public Object processObjectValue(String key, Object value, JsonConfig jsonConfig) {
if(value == null)
{
return "";
}
if(value instanceof java.sql.Timestamp)
{
String str = new SimpleDateFormat(format).format((java.sql.Timestamp)value);
return str;
}
if (value instanceof java.util.Date)
{
String str = new SimpleDateFormat(format).format((java.util.Date) value);
return str;
} return value.toString();
} }
package com.easyuijson.servlet;

import java.io.IOException;
import java.util.ArrayList;
import java.util.List; import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse; import org.json.JSONObject; import com.easyuijson.model.Student;
import com.easyuijson.util.DateJsonValueProcessor;
import com.easyuijson.util.ResponseUtil; import net.sf.json.JSONArray;
import net.sf.json.JsonConfig; public class DatagridData extends HttpServlet {
private static final long serialVersionUID = 1L;
private static List<Student> studentList=null;
static {
studentList = new ArrayList<Student>();
Student student1 = new Student(1001, "Lucy", "男", 23, "Lucy@126.com", "84562548", "三个地方规划的恢复规划法规部分");
Student student2 = new Student(1002, "Lucy", "男", 23, "Lucy@126.com", "84562548", "三个地方规划的恢复规划法规部分");
Student student3 = new Student(1003, "Lucy", "男", 23, "Lucy@126.com", "84562548", "三个地方规划的恢复规划法规部分");
Student student4 = new Student(1004, "Lucy", "男", 23, "Lucy@126.com", "84562548", "三个地方规划的恢复规划法规部分");
Student student5 = new Student(1005, "Lucy", "男", 23, "Lucy@126.com", "84562548", "三个地方规划的恢复规划法规部分");
Student student6 = new Student(1006, "Lucy", "男", 23, "Lucy@126.com", "84562548", "三个地方规划的恢复规划法规部分");
studentList.add(student1);
studentList.add(student2);
studentList.add(student3);
studentList.add(student4);
studentList.add(student5);
studentList.add(student6);
} @Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp){
try {
System.out.println("跳转成功!");
int total = studentList.size();
JSONObject result = new JSONObject();
JsonConfig jsonConfig = new JsonConfig();
jsonConfig.registerJsonValueProcessor(java.util.Date.class,
new DateJsonValueProcessor("yyyy-MM-dd"));
JSONArray jsonArray = JSONArray.fromObject(studentList, jsonConfig);
result.put("rows", jsonArray);
result.put("total", total);
ResponseUtil.write(resp, result);
} catch (Exception ex) {
ex.printStackTrace();
}
} @Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
doGet(req, resp);
} }
package com.easyuijson.util;

import java.io.PrintWriter;
import javax.servlet.http.HttpServletResponse;
public class ResponseUtil { public static void write(HttpServletResponse response,Object o)throws Exception{
response.setContentType("text/html;charset=utf-8");
PrintWriter out=response.getWriter();
out.println(o.toString());
out.flush();
out.close();
}
}

   1)使用Ajax请求数据

<body>
<table id="dg" class="easyui-datagrid" title="基本数据表格"
style="width: 700px; height: 250px"
data-options="singleSelect:true,collapsible:true">
<thead data-options="frozen:true">
<tr>
<th data-options="field:'stuId',width:100">学生ID</th>
<th data-options="field:'stuName',width:100">学生姓名</th>
</tr>
</thead>
<thead>
<tr>
<th data-options="field:'stuSex',width:100">学生性别</th>
<th data-options="field:'stuAge',width:100">学生年龄</th>
<th data-options="field:'stuEmail',width:100,align:'center'">学生邮箱</th>
<th data-options="field:'stuQQ',width:100,align:'right'">学生QQ</th>
<th data-options="field:'stuAddress',width:200,align:'center'">学生地址</th>
</tr>
</thead>
</table>
</body>
<script type="text/javascript">
$(function() {
//动态加载标题和数据
$.ajax({
url : "${pageContext.request.contextPath}/datagridData.do",
type : "post",
dataType : "json",
success : function(data) {
$("#dg").datagrid("loadData", data.rows); //动态取数据
}
});
});
</script>

   2)使用表格Url属性请求数据

<table class="easyui-datagrid" title="基本数据表格"
style="width: 700px; height: 250px"
data-options="singleSelect:true,collapsible:true,url:'${pageContext.request.contextPath}/datagridData.do'">
<thead data-options="frozen:true">
<tr>
<th data-options="field:'stuId',width:100">学生ID</th>
<th data-options="field:'stuName',width:100">学生姓名</th>
</tr>
</thead>
<thead>
<tr>
<th data-options="field:'stuSex',width:100">学生性别</th>
<th data-options="field:'stuAge',width:100">学生年龄</th>
<th data-options="field:'stuEmail',width:100,align:'center'">学生邮箱</th>
<th data-options="field:'stuQQ',width:100,align:'right'">学生QQ</th>
<th data-options="field:'stuAddress',width:200,align:'center'">学生地址</th>
</tr>
</thead>
</table>

   3)js创建表格的时候使用表格Url属性请求数据 

<body>
<table id="studentList"></table>
</body>
<script type="text/javascript">
$('#studentList').datagrid({
title : '基本数据表格',
width : 700,
height : 250,
url : '${pageContext.request.contextPath}/datagridData.do',
frozenColumns : [ [ {
field : 'stuId',
title : '学生ID',
width : 100
}, {
field : 'stuName',
title : '学生姓名',
width : 100
} ] ],
columns : [ [ {
field : 'stuSex',
title : '学生性别',
width : 100
}, {
field : 'stuAge',
title : '学生年龄',
width : 100
}, {
field : 'stuEmail',
title : '学生邮箱',
width : 100
}, {
field : 'stuQQ',
title : '学生QQ',
width : 100
}, {
field : 'stuAddress',
title : '学生地址',
width : 200,
align : 'center'
} ] ] });
</script>

   第二种方式:通过JSTL填充表格

   1)前端页面

<table class="easyui-datagrid" title="基本数据表格"
style="width: 700px; height: 250px"
data-options="singleSelect:true,collapsible:true,url:'${pageContext.request.contextPath}/datagridData.do'">
<thead data-options="frozen:true">
<tr>
<th data-options="field:'stuId',width:100">学生ID</th>
<th data-options="field:'stuName',width:100">学生姓名</th>
</tr>
</thead>
<thead>
<tr>
<th data-options="field:'stuSex',width:100">学生性别</th>
<th data-options="field:'stuAge',width:100">学生年龄</th>
<th data-options="field:'stuEmail',width:100,align:'center'">学生邮箱</th>
<th data-options="field:'stuQQ',width:100,align:'right'">学生QQ</th>
<th data-options="field:'stuAddress',width:200,align:'center'">学生地址</th>
</tr>
</thead>
<tbody>
<c:forEach var="student" items="${studentList}">
<tr>
<td>${student.stuId}</td>
<td>${student.stuName}</td>
<td>${student.stuSex}</td>
<td>${student.stuAge}</td>
<td>${student.stuEmail}</td>
<td>${student.stuQQ}</td>
<td>${student.stuAddress}</td>
</tr>
</c:forEach>
</tbody>
</table>

   2)后台代码,使用servlet处理数据

package com.easyuijson.servlet;

import java.io.IOException;
import java.util.ArrayList;
import java.util.List; import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession; import com.easyuijson.model.Student; public class DatagridData extends HttpServlet {
private static final long serialVersionUID = 1L;
private static List<Student> studentList=null;
static {
studentList = new ArrayList<Student>();
Student student1 = new Student(1001, "Lucy", "男", 23, "Lucy@126.com", "84562548", "三个地方规划的恢复规划法规部分");
Student student2 = new Student(1002, "Lucy", "男", 23, "Lucy@126.com", "84562548", "三个地方规划的恢复规划法规部分");
Student student3 = new Student(1003, "Lucy", "男", 23, "Lucy@126.com", "84562548", "三个地方规划的恢复规划法规部分");
Student student4 = new Student(1004, "Lucy", "男", 23, "Lucy@126.com", "84562548", "三个地方规划的恢复规划法规部分");
Student student5 = new Student(1005, "Lucy", "男", 23, "Lucy@126.com", "84562548", "三个地方规划的恢复规划法规部分");
Student student6 = new Student(1006, "Lucy", "男", 23, "Lucy@126.com", "84562548", "三个地方规划的恢复规划法规部分");
studentList.add(student1);
studentList.add(student2);
studentList.add(student3);
studentList.add(student4);
studentList.add(student5);
studentList.add(student6);
} @Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
System.out.println("跳转成功!");
HttpSession httpSession= req.getSession();
httpSession.setAttribute("studentList",studentList);for(Student stu:studentList) {
System.out.println(stu);
}
} @Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
doGet(req, resp);
} }

EasyUI表格DataGrid获取数据的方式的更多相关文章

  1. Request三种获取数据的方式

    今天在做ajax请求后台代码时,发现ajax的方法都对,但就是请求不了后台代码,后来在同事帮助下才发现前台定义了两个相同参数导致请求出错. 下面记录一下request三种获取数据的方式: 1. Req ...

  2. MFC获取数据的方式

    假设输入框ID是:ID_NUMBER1,ID_NUMBER2,ID_NUMBER3. 获取数据的方式是: int number1,number2,number3; number1 = GetDlgIt ...

  3. Layui数据表格的接口数据请求方式为Get

    Layui数据表格的接口数据请求方式为Get

  4. EasyUI的datagrid获取所有正在编辑状态的行的行编号

    今天项目需要用了下EasyUI的datagrid的行编辑功能,跟着API来,只要是将各种状态时的处理逻辑弄好,还是蛮不错的. 开发过程中,遇到了个问题,在编辑完成后我需要获取datagrid所有处于编 ...

  5. 关于url拼接传参数和利用view的字典传参数时,模板获取数据的方式问题

    url = "{% url 'dashboard:internship-theme-stat' %}?teacher_name="+teacher_name+"& ...

  6. EasyUI表格DataGrid前端分页和后端分页的总结

    Demo简介 Demo使用Java.Servlet为后台代码(数据库已添加数据),前端使用EasyUI框架,后台直接返回JSON数据给页面 1.配置Web.xml文件 <?xml version ...

  7. EasyUI表格DataGrid格式化formatter用法

    1.通过HTML标签创建数据表格时使用formatter <!DOCTYPE html> <html> <head> <meta charset=" ...

  8. 经历:easyui的datagrid没有数据滚动条的显示

    今天,一个用户提出一个这样的问题,"查询不到结果时,为什么我看不到后面的标题呢?" 最初,我听到这个问题时,第一反应是:查出来数据不就有滚动条了吗,干嘛非要较真呢? 不过,后来想想 ...

  9. EL表达式获取数据的方式

    <%@page import="cn.jiemoxiaodi.domain.Person"%> <%@ page language="java" ...

随机推荐

  1. quartz实现定时任务

    一个定时的demo 引入maven依赖: <dependency> <groupId>org.quartz-scheduler</groupId> <arti ...

  2. 什么是cookie?cookie的使用(设置,读取,删除)

    1.什么是cookie?     页面用来保存信息            比如:自动登录,记住用户名     cookie的特性           同一个网站所有页面共用一套cookie       ...

  3. mysql存储过程游标嵌套循环

    自己写的一个mysql存储过程如下: BEGIN DECLARE _did bigint(20);DECLARE _count int;DECLARE s1 int;DECLARE cur_1 CUR ...

  4. VB改写C#

    1.VB的Val()函数 先从程序集中引入Microsoft.VisualBasic命名空间.不过,即便是引入了Microsoft.VisualBasic命名空间,还是不能直接使用像Val()这样的函 ...

  5. java使用DateUtils对日期进行运算

    最近在写数据上传的程序,需要对Date进行一些数学运算,个人感觉在java中,日期的数学运算还是比较常用的,所以把Date的数学运算都玩了一下.试了一下,发现DateUtils这个工具类对于Date的 ...

  6. 微信小程序分享支持自定义封面图

    微信小程序又发布更新了,刚好昨天支付宝也发布小程序,不能让它抢了风头的节奏.微信小程序主要更新如下:“小程序分享支持自定义封面图,公众号及小程序客服可发送小程序卡片.同时,我们还开放了获取发票抬头,指 ...

  7. equals和contains的区别

    equals只能判断两个变量的值是否相等.contains常用与集合中判断某个对象是否含有这个元素equals是需要两个对象完全相同才会返回true,而contains是要循环遍历容器里的所有内容后判 ...

  8. 一份C++学习资源,咬牙切齿地好用呀

    多年以后,你已经是一名技术总监,有一个美丽的妻子,两个孩子:你已经拥有了现在的你想都不敢想的一切:那时,你也一定会忘记,今天这篇教程,如同一颗石子,铺就过你前进的路. 下面是我们的老师根据现有资源整理 ...

  9. Boolean数据类型

    boolean 数据类型 boolean 变量存储为 8位(1 个字节)的数值形式,但只能是 True 或是 False,可以把它看做是一个和1代替,并且一定要小写.boolean operate是指 ...

  10. js快速排序算法解析

    数组的快速排序算法,和并归排序步骤基本类似. 都是先拆分,后合并.并归排序是:拆分容易,合并难. 快速排序是:拆分难,合并容易 要理解快速排序,首先要理解拆分逻辑 要素:找一个基准点,通过操作使得数列 ...