52,797
社区成员
发帖
与我相关
我的任务
分享
<!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>Show Data</title>
<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />
<script type="text/javascript" src="ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext/ext-all.js"></script>
<script type="text/javascript">
Ext.onReady(function(){
// create the Data Store
var store = new Ext.data.JsonStore({
proxy: new Ext.data.ScriptTagProxy({
url: 'MessageServlet'
}),
root: "messages",
totalProperty: "total",
fields: [
{name: 'message_id', mapping:"'message_id'", type: 'int'},
{name: 'head',mapping:"'head'"},
{name: 'body',mapping:"'body'"},
{name: 'revs_time',mapping:"'revs_time'"},
{name: 'flag',mapping:"'flag'"},
]
});
var pagingBar = new Ext.PagingToolbar({
pageSize: 25,
store: store,
displayInfo: true,
displayMsg: 'Displaying topics {0} - {1} of {2}',
emptyMsg: "No topics to display",
items:[
'-', {
pressed: true,
enableToggle:true,
text: 'Show Preview',
cls: 'x-btn-text-icon details',
toggleHandler: function(btn, pressed){
// var view = grid.getView();
// view.showPreview = pressed;
// view.refresh();
}
}]
});
var grid = new Ext.grid.GridPanel({
el:'grid_Cbb',
width:700,
height:500,
title:'My MessageList',
store: store,
trackMouseOver:false,
disableSelection:true,
loadMask: true,
// grid columns
columns:[{
header:"id",
dataIndex:'message_id',
width:160,
sortable: true
},{
header: "head",
dataIndex: 'head',
width: 150,
sortable: true
},{
header: "body",
dataIndex:'body',
width: 200,
sortable: true
},{
header: "time",
dataIndex: 'revs_time',
width: 150,
align: 'right',
sortable: true
},{
header: "flag",
dataIndex: 'flag',
width: 100,
sortable: true
}],
// paging bar on the bottom
bbar: pagingBar
});
//var gridHead=grid.getView().getHeaderPanel(true);
// render it
grid.render();
// trigger the data store load
store.load({params:{start:0, limit:15}});
});
</script>
</head>
<body>
<div id="grid_Cbb" style="height:265px" align="center" >
</div>
</body>
</html>
package com.ui.servlet;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.List;
import javax.servlet.RequestDispatcher;
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.test.entity.MessageBean;
import com.test.entity.UserBean;
import com.ui.biz.MessageBiz;
import com.ui.biz.MessageBizImpl;
import com.ui.biz.UserBiz;
import com.ui.biz.UserBizImpl;
/**
* Servlet implementation class LoginServlet
*/
public class MessageServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
/**
* @see HttpServlet#HttpServlet()
*/
public MessageServlet() {
super();
// TODO Auto-generated constructor stub
}
/**
* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
*/
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doPost(request,response);
}
/**
* @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
*/
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
request.setCharacterEncoding("UTF-8");
UserBiz userBiz=new UserBizImpl();
MessageBiz messageBiz=new MessageBizImpl();
List messageList=messageBiz.getMessage();
String json="{totalProperty:"+messageList.size()+",root:[\n";
for(int i=0;i<messageList.size();i++){
MessageBean message=(MessageBean)messageList.get(i);
json+="{message_id:'"+message.getMessage_id()+"',head:'"+message.getHead()+"',body:'"+message.getBody()+"',revs_time:'"+message.getRevs_time()+"',flag:'"+message.isFlag()+"'}";
if(i<messageList.size()-1){
json+=",\n";
}
}
json+="\n]}";
System.out.println(json);
response.getWriter().println(json);
}
}
var store=new Ext.data.JsonStore({
// autoLoad : true,
url: "<%=path%>/contacterManage.do?action=findAllContacter",
fields: [ 'groupName','groupId','id','text','contacterNumber','contacterBirthday','contacterAddress','contacterCompanyName'
,'contacterCompanyAddress','contacterFax','contacterEmail','contacterZipCode','contacterRemarks']
});
/*
加载数据,
参数: flag:all 表示查询所有的数据
*/
store.load({params:{flag:'all'}});
var sm = new Ext.grid.CheckboxSelectionModel();
var colM = new Ext.grid.ColumnModel([
new Ext.grid.RowNumberer(), //自动行号
sm,
{header:"所在组",sortable: true,dataIndex:"groupName"},
{header:"姓名",sortable: true,dataIndex:"text"},
{header:"手机号码",sortable: true,dataIndex:"contacterNumber"},
{header:"生日",sortable: true,dataIndex:"contacterBirthday"},
{header:"地址",sortable: true,dataIndex:"contacterAddress"},
{header:"公司名称",sortable: true,dataIndex:"contacterCompanyName"},
{header:"公司地址",sortable: true,dataIndex:"contacterCompanyAddress"},
{header:"传真",sortable: true,dataIndex:"contacterFax"},
{header:"邮箱",sortable: true,dataIndex:"contacterEmail"},
{header:"邮编",sortable: true,dataIndex:"contacterZipCode"},
{header:"备注",sortable: true,dataIndex:"contacterRemarks"}
]);
var gridConacterInfo = new Ext.grid.GridPanel({
cm : colM,
sm : sm,
store : store,
height: 468,
width : 820,
collapsible: true,
autoScroll:true,
loadMask:true,
animCollapse: false,
iconCls: 'icon-grid',
listeners : {
rowdblclick : function( grid , rowIndex , e){
// 获得行数据
var record = grid.getStore().getAt(rowIndex);
dbClickviewConacterInfo(record ,"查看联系人信息");
}
}
});
public ActionForward findAllContacter(ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response) throws IOException {
// TODO Auto-generated method stub
try{
String flag = request.getParameter("flag");
if(flag.toString().trim().equals("all")){
// 查询所有的数据
ContacterService service = new ContacterService();
ArrayList allContacterList = service.findAllContacter();
// 将数据使用 JSON 格式化后发回 Ext 客户端
JSONObject json = new JSONObject();
JSONArray dataArray=JSONArray.fromObject(allContacterList);
System.out.println(dataArray);
response.getWriter().println(dataArray);
}
catch(Exception e){
printStackTrace();
}
return null;
}
...
System.out.println(json);
response.setContentType("text/xml;charset=UTF-8");
response.getWriter().println(json);
...
<!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>Show Data</title>
<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />
<script type="text/javascript" src="ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext/ext-all.js"></script>
<script type="text/javascript">
Ext.onReady(function(){
// create the Data Store
var store = new Ext.data.JsonStore({
proxy: new Ext.data.ScriptTagProxy({
url: 'MessageServlet'
}),
root: "root",
totalProperty: "totalProperty",
fields: [
'message_id','head,body','revs_time','flag'
]
});
var pagingBar = new Ext.PagingToolbar({
pageSize: 25,
//store: store,
displayInfo: true,
displayMsg: 'Displaying topics {0} - {1} of {2}',
emptyMsg: "No topics to display",
items:[
'-', {
pressed: true,
enableToggle:true,
text: 'Show Preview',
cls: 'x-btn-text-icon details',
toggleHandler: function(btn, pressed){
// var view = grid.getView();
// view.showPreview = pressed;
// view.refresh();
}
}]
});
var grid = new Ext.grid.GridPanel({
el:'grid_Cbb',
width:700,
height:500,
title:'My MessageList',
store: store,
trackMouseOver:false,
disableSelection:true,
loadMask: true,
// grid columns
columns:[{
header:"id",
dataIndex:'message_id',
width:160,
sortable: true
},{
header: "head",
dataIndex: 'head',
width: 150,
sortable: true
},{
header: "body",
dataIndex:'body',
width: 200,
sortable: true
},{
header: "time",
dataIndex: 'revs_time',
width: 150,
align: 'right',
sortable: true
},{
header: "flag",
dataIndex: 'flag',
width: 100,
sortable: true
}],
// paging bar on the bottom
bbar: pagingBar
});
//var gridHead=grid.getView().getHeaderPanel(true);
// render it
grid.render();
// trigger the data store load
store.load({params:{start:0, limit:15}});
});
</script>
</head>
<body>
<div id="grid_Cbb" style="height:265px" align="center" >
</div>
</body>
</html>