手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >jquery easyui 结合jsp简单展现table数据示例
jquery easyui 结合jsp简单展现table数据示例
摘要:复制代码代码如下:InserttitlehereFirstNameLastNamePhoneEmail复制代码代码如下:Inserttitl...

复制代码 代码如下:

<%@ page language="java" contentType="text/html; charset=UTF-8"

pageEncoding="UTF-8"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>Insert title here</title>

<link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css">

<link rel="stylesheet" type="text/css" href="easyui/themes/icon.css">

<script type="text/javascript" src="easyui/jquery-1.8.0.min.js"></script>

<script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>

</head>

<body>

<table id="dg" title="My Users"

url="getUsers.jsp"

toolbar="#toolbar" rownumbers="true"

fitColumns="true" singleSelect="true">

<thead>

<tr>

<th field="firstname" width="50">First Name</th>

<th field="lastname" width="50">Last Name</th>

<th field="phone" width="50">Phone</th>

<th field="email" width="50">Email</th>

</tr>

</thead>

</table>

</body>

</html>

复制代码 代码如下:

<%@page import="net.sf.json.JSONArray"%>

<%@page import="java.util.*"%>

<%@page import="org.codehaus.jackson.map.ObjectMapper"%>

<%@ page language="java" contentType="text/html; charset=UTF-8"

pageEncoding="UTF-8"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>Insert title here</title>

</head>

<body>

<%

//String json = "{"firstname":"firstname","lastname":"lastname","phone":123456,"email":"281446883@qq.com"}";

List<Map<String,String>> list = new ArrayList<Map<String,String>>();

Map<String,String> user1 = new HashMap<String,String>();

user1.put("firstname", "name1");

user1.put("lastname", "name2");

user1.put("phone", "1234");

user1.put("email", "281446888@qq.com");

list.add(user1);

Map<String,String> user2 = new HashMap<String,String>();

user2.put("firstname", "name2");

user2.put("lastname", "name4");

user2.put("phone", "1234");

user2.put("email", "281446888@qq.com");

list.add(user2);

JSONArray jsonArray = JSONArray.fromObject(list);

System.out.println(jsonArray.toString());

Map<String,Object> map = new HashMap<String,Object>();

map.put("total", 1);

map.put("rows", jsonArray);

ObjectMapper objMap = new ObjectMapper();

objMap.writeValue(response.getWriter(), map);

//System.out.println(json);

%>

</body>

</html>

效果:

1

【jquery easyui 结合jsp简单展现table数据示例】相关文章:

jquery简单实现外部链接用新窗口打开的方法

jquery实现弹出层效果实例

jQuery插件制作之全局函数用法实例

jquery控制表单输入框显示默认值的方法

javascript实现table表格隔行变色的方法

jQuery+ajax实现无刷新级联菜单示例

jquery使用each方法遍历json格式数据实例

简单介绍JavaScript的变量和数据类型

js+html5实现canvas绘制简单矩形的方法

jQuery Timelinr实现垂直水平时间轴插件(附源码下载)

精品推荐
分类导航