【发布时间】：2013-10-01 01:49:17
【问题描述】：
我是 jQuery 新手，在我的 jsp 中将数据从我的 servlet 显示到 jqGrid 时遇到困难。 我使用 google gson 将数据从 ArrayList 转换为字符串变量 json。 当我运行项目并显示一个空网格时，它在控制台中显示 json 数据。
学生.java
package com
public class Student {
private String name;
private String mark;
private String address;
//getter and setters
StudentDataService.java
package com;
import java.util.ArrayList;
import java.util.List;
import com.Student;
public class StudentDataService {
public static List<Student> getStudentList() {
List<Student> listOfStudent = new ArrayList<Student>();
Student aStudent = new Student();
for (int i = 1; i <= 10; i++) {
aStudent = new Student();
aStudent.setName("R" + i);
aStudent.setMark("20" + i);
aStudent.setAddress("pune "+i);
listOfStudent.add(aStudent);
}
return listOfStudent;
}
}
我的 servlet 代码：
StudentDataServlet.java
package com;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.List;
import com.google.gson.Gson;
import com.google.gson.GsonBuilder;
import com.Student;
import com.StudentDataService;
/**
* Servlet implementation class StudentDataServlet
*/
public class StudentDataServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
public StudentDataServlet() {
super();
}
protected void doGet(HttpServletRequest request,
HttpServletResponse response) throws ServletException, IOException {
response.setContentType("application/json");
PrintWriter out = response.getWriter();
List<Student> lisOfStudent = StudentDataService.getStudentList();
Gson gson = new GsonBuilder().setPrettyPrinting().create();
String json = gson.toJson(lisOfStudent);
out.print(json);
System.out.println(json);
}
protected void doPost(HttpServletRequest request,
HttpServletResponse response) throws ServletException, IOException {
doGet(request, response);
}
}
我的 JSP 页面：
slickGridDemo.jsp
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>jqGrid Example</title>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.6.2.js'></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/
libs/jqueryui/1.8.14/jquery-ui.js">
</script>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/themes/base/jquery-ui.css">
<link rel="stylesheet" type="text/css" href="http://trirand.com/blog/jqgrid/themes/ui.jqgrid.css">
<script type='text/javascript' src="http://trirand.com/blog/jqgrid/js/i18n/grid.locale- en.js"></script>
<script type='text/javascript' src="http://trirand.com/blog/jqgrid/js/jquery.jqGrid.min.js"></script>
<style type='text/css'>
</style>
<script type='text/javascript'>
jQuery(document).ready(function () {
jQuery("#grid").jqGrid({
url: "http://localhost:9080/JquerySlickGrid/StudentDataServlet",
datatype: "json",
jsonReader: {repeatitems: false, id: "ref"},
colNames:['Name','Marks', 'Address'],
colModel:[
{name:'Name',index:'Name', width:100},
{name:'Marks',index:'Marks', width:100},
{name:'Address',index:'Address', width:500}
],
rowNum:20,
rowList:[20,60,100],
height:460,
pager: "#pagingDiv",
viewrecords: true,
caption: "Json Example"
});
});
</script>
</head>
<body>
<table id="grid"></table>
<div id="pagingDiv"></div>
</body>
</html>
【问题讨论】：
标签： java jquery jsp servlets jqgrid