extjs 分页使用jsp传递数据示例

Ext.onReady(function() {

store3 = new Ext.data.JsonStore({
autoDestroy: true,
totalProperty : 'totle',
url: 'service.do',
storeId: 'myStore',
root: 'data',
fields : [ 'id', "name", "pw" ]
});

var pagingToolbar = new Ext.PagingToolbar({
emptyMsg : "没有数据",
displayInfo : true,
displayMsg : "显示从{0}条数据到{1}条数据,共{2}条数据",
store : store3,
pageSize : 50
});

var grade = new Ext.grid.GridPanel({
title : "数据列表",
store : store3,
height : 300,
bbar : pagingToolbar,
columns : [ {
header : "id",
dataIndex : "id",
width : 300
}, {
header : "name",
dataIndex : "name",
width : 300
}, {
header : "pw",
dataIndex : "pw"
} ],
region : 'center'
});

var panel = new Ext.Viewport({
layout : 'border',
items : [ grade ]
});
});

action********************

protected void service(HttpServletRequest request,
HttpServletResponse response) throws ServletException, IOException {

List list = new ArrayList();
for (int i = 0; i < 50; i++) {
Person p = new Person();
p.setId("id" + i);
p.setName("name" + i);
p.setPw("pw" + i);
list.add(p);
}
StringBuffer info = new StringBuffer();
info.append("{totle:2000,data:");
info.append(JSONArray.fromObject(list));
info.append("}");
System.out.println(info.toString());
System.out.println("*****doPos");
request.setAttribute("info", info.toString());
request.getRequestDispatcher("/info.jsp").forward(request, response);
}

info.jsp************注意:jsp除了 @page 不能有其他的文字

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
${info}

web.xml***************

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
id="WebApp_ID" version="2.5">
<servlet>
<servlet-name>test</servlet-name>
<servlet-class>com.aa.TestAction</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>test</servlet-name>
<url-pattern>*.do</url-pattern>
</servlet-mapping>

<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
</web-app>
(0)

相关推荐

  • jsp分页显示完整实例

    本文实例讲述了jsp分页显示的实现方法.分享给大家供大家参考. 具体实现方法如下: 复制代码 代码如下: <%@ page contentType="text/html; charset=gb2312" language="java" import="java.sql.*" errorPage="" %> <%@include file ="../inc/ChkPwd.jsp"%>

  • JS+CSS实现的拖动分页效果实例

    本文实例讲述了JS+CSS实现拖动分页效果的方法.分享给大家供大家参考.具体实现方法如下: <html> <head> <title>拖动分页</title> <meta http-equiv=Content-Type content="text/html; charset=utf-8"> <style> body{ border:0px; margin:0px; overflow:hidden; backgrou

  • js+css实现的简单易用兼容好的分页

    效果:  html: 复制代码 代码如下: <div id="page"></div> 用法: 复制代码 代码如下: var total = 310; var pageNo = 1; var pageCount = 31;//共有多少页 var pageSize = 10; var actionName = "list.action"; var otherParam = "&name='www'&order='tim

  • js分页代码分享

    复制代码 代码如下: <html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Insert title here</title><script  type='text/javascript' src='jQuery.js'></script><style type

  • js控制分页打印、打印分页示例

    复制代码 代码如下: <%@ 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&qu

  • js对文章内容进行分页示例代码

    Thinkphp中文章显示代码: 复制代码 代码如下: <div id="showContent">{$article.content|htmlspecialchars_decode}</div> <div id="articlePages"></div> js实现代码: 复制代码 代码如下: <script type="text/javascript"> var obj = docum

  • js写的评论分页(还不错)

    复制代码 代码如下: <%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme() + "://" + request.getServer

  • js分页工具实例

    本文实例讲述了js分页工具的用法.分享给大家供大家参考.具体实现方法如下: js代码部分: 复制代码 代码如下: /**   * 分页js   */  var Page;    (function(){          var Page = {version:"1.0",author:"liuxingmi"};          var showPage = 9;          Page.navigation = function(divId, totalRe

  • JS实现动态移动层及拖动浮层关闭的方法

    本文实例讲述了JS实现动态移动层及拖动浮层关闭的方法.分享给大家供大家参考.具体实现方法如下: <html> <head> <title>动态移动的层</title> <body bgcolor="#ADBAC9"> <div id="div1" class="yellow" style="VISIBILITY:visible ; background-color:#FF

  • js用拖动滑块来控制图片大小的方法

    本文实例讲述了js用拖动滑块来控制图片大小的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <meta http-equiv=Content-Type content="text/html;charset=gb2312"> <title&g

随机推荐