- 浏览: 326141 次
- 性别:
- 来自: 沈阳
文章分类
- 全部博客 (160)
- Hiberate (13)
- struts+spring+hibernate (8)
- tomcat服务器 (3)
- sql server2000数据库 (1)
- JSTL标签 (4)
- 数据库 (1)
- jsp (3)
- mysql (4)
- xml (2)
- 字符串操作 (6)
- js (2)
- 过滤器 (0)
- dwr (2)
- Extjs学习笔记 (12)
- java文件 (2)
- struts错误记录 (2)
- struts经验技巧 (2)
- struts+spring+ibatis (3)
- 学习积累--分页的实现过程 (8)
- 递归 (1)
- 工具使用 (1)
- swfupload批量上传 (1)
- flex+webservice (1)
- 精彩文章分享 (0)
- flex+eclipse开发环境 (1)
- DB2数据库 (2)
- ssh+pager taglib分页实现 (2)
- java (0)
- java 异常 (2)
- mylipse6.5 环境内存溢出 (2)
- java 操作word文件 (1)
- 异常整理 (1)
- sql server 2005使用心得 (3)
- jdbc数据库封装 (1)
- javaMail 收发邮件 (1)
- 数据库设计 (1)
- jfreechart图表研究 (1)
- ibatis 学习积累 (1)
- 强制固定表格 (1)
- struts+hibernate (1)
- 分页标签的使用 (1)
- 基于mediawiki的安装心得 (1)
- mediawiki (0)
- Sturs2+Spring2.5+Hibernate3.5+compass 整合 (1)
- RestEasy (3)
- Date 日期公共类整理 (1)
- Excel (8)
- JAVA生成PDF文件 (1)
- Struts1.2+Jquery+Hibernate (1)
- 数据库连接池配置 (0)
- ANT 学习实例 (2)
- 英语学习总结 (1)
- Google动画脚本收藏 (1)
- 20111012 Google动画脚本 (0)
- JQUERY资料整理 (2)
- java图片处理 (1)
- Map集合 (1)
- JAVA 整理AD资料 (2)
- JAVA热启动 (3)
- JAVA操作XML (1)
- TOMCAT6连接池配置问题解决方案 (1)
- JAVA调用DLL学习 (1)
- JAVA移动应用(发送手机短信) (2)
- JAVA发送手机短信 (1)
- iReport报表使用心得 (2)
- 解决Ireport生成PDF报表中文乱码问题 (1)
- iReport使用 (1)
- 全文搜索 compass (1)
- SVN管理 (1)
- Myeclipse8.5 工具编译 (1)
- ibm appscan 扫描问题汇总解决 (1)
- Rose建模设计工具 (1)
- oracle (1)
- MyEclipse8.5注册码(8.6也可以) (0)
- oracle job定时触发执行 (1)
- java Excel导出公用类 (1)
- Highcharts图表 (1)
- excel打包成zip文件,并且提供加密功能 (0)
- excel打包成zip文件 (1)
- 并且提供加密功能 (1)
- vue学习 (1)
- WebStorm使用 (1)
最新评论
-
ahkoun:
楼主棒棒哒,下载后可以直接运行
使用 RestEasy 和 Apache Tomcat 构建 RESTful Web 服务 -
520920:
真的可以了,很棒!
java.lang.Exception: DEBUG -- CLOSE BY CLIENT STACK TRACE -
Yellow013:
不错的例子。
使用 RestEasy 和 Apache Tomcat 构建 RESTful Web 服务 -
huahoucun:
passwd = null; env.put(Context. ...
JAVA 实现AD验证 -
来迟了:
http://www.smschinese.cn/api.sh ...
JAVA发送手机短信
前几天我们项目组讨论给**公司关于**产品做一个功能展示的用例。讨论到view层时,用那种框架。最终选中了大名鼎鼎的EXT JS 框架来做view。这里的view涉及的不是很复杂。因为它仅仅是个Demo。最常用的就是分页显示数据了。目前extjs仅仅支持xml和json两种格式的数据展现。就性能而言。Extjs不可能用于较大的项目。性能确实不敢恭维。这里我们仅仅简单的介绍一下它的分页原理。其实他的源码中提供了大量的例子。可以参考一下。该例子就是基于它的官方例子实现的。目前,市场是比较流行的数据关于extjs就是“深入浅出extjs“了,该书编写的却是不怎么样。如果想学习extjs,最好研究研究它的源码的例子就行了。
Jar包如下:
其中json-lib-2.2.1-jdk1.5.jar xstream-1.3.jar是转换集合类型转换json类型的主要jar包。
测试工程的包路径如下:
该示例是用strus2做的mvc。
action类:
package action;
import bean.Bean;
import com.opensymphony.xwork2.ActionSupport;
import java.util.ArrayList;
import java.util.List;
import javax.servlet.http.*;
import org.apache.commons.logging.Log;
import org.apache.commons.logging.LogFactory;
import org.apache.struts2.ServletActionContext;
import util.ExtHelper;
public class DisplayAction extends ActionSupport
{
private static final Log log=LogFactory.getLog(DisplayAction.class);
private static final long serialVersionUID = 1L;
private HttpServletResponse response;
private HttpServletRequest request;
private int start;
private int limit;
//表示数据库中数据总条数,用户分页显示
private static final long totalResult=100;
public String display() throws Exception
{
List list=new ArrayList();
for(int i=0;i<5;i++){
bean.Bean bean=new Bean();
bean.setId(i);
bean.setDetail("detil"+i);
bean.setTitle("title"+i);
list.add(bean);
}
String json = ExtHelper.getJsonFromList(totalResult,list);
log.info("list转换成json格式的数据开始");
log.info(json);
response = ServletActionContext.getResponse();
response.setContentType("application/xml;charset=UTF-8");
response.getWriter().write(json);
return null;
}
}
Po类:
package bean;
public class Bean {
private int id;
private String title;
private String detail;
public int getId() {
return id;
}
public void setId(int id) {
this.id = id;
}
public String getTitle() {
return title;
}
public void setTitle(String title) {
this.title = title;
}
public String getDetail() {
return detail;
}
public void setDetail(String detail) {
this.detail = detail;
}
}
ExtHelper类:
package util;
import java.util.ArrayList;
import java.util.List;
import net.sf.json.JSONObject;
import com.thoughtworks.xstream.XStream;
import com.thoughtworks.xstream.io.xml.DomDriver;
public class ExtHelper {
/**
*list转换成xml
*/
public static String getXmlFromList(long recordTotal , List beanList) {
Total total = new Total();
total.setResults(recordTotal);
List resultlist = new ArrayList();
resultlist.add(total);
resultlist.addAll(beanList);
XStream sm = new XStream(new DomDriver());
for (int i = 0; i < resultlist.size(); i++) {
Class c = resultlist.get(i).getClass();
String b = c.getName();
String[] temp = b.split("\\.");
sm.alias(temp[temp.length - 1], c);
}
String xml = "<?xml version=\"1.0\" encoding=\"utf-8\"?>\n" + sm.toXML(resultlist);
System.out.println("**********************************"+xml);
return xml;
}
/**
*list转换成json
*/
public static String getJsonFromList(long recordTotal , List ListbeanList){
TotalJson total = new TotalJson();
total.setResults(recordTotal);
total.setItems(ListbeanList);
JSONObject JsonObject = JSONObject.fromObject(total);
return JsonObject.toString();
}
}
TotalJson类:
package util;
import java.util.List;
public class TotalJson {
private long results;
private List items;
public List getItems() {
return items;
}
public void setItems(List items) {
this.items = items;
}
public long getResults() {
return results;
}
public void setResults(long results) {
this.results = results;
}
}
Struts.xml
<!DOCTYPE struts PUBLIC '-//Apache Software Foundation//DTD Struts Configuration 2.0//EN'
'http://struts.apache.org/dtds/struts-2.0.dtd'>
<struts>
<constant name="struts.i18n.encoding" value="UTF-8"/>
<package name="ext_fenye" extends="struts-default">
<action name="getDataList" class="action.DisplayAction" method="display"></action>
</package>
</struts>
JSP:
<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%>
<html>
<head>
<title>ExtJs-FenYe</title>
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/pagesExt/ext-2.2.1/resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/pagesExt/css/style.css" />
<script type="text/javascript" src="${pageContext.request.contextPath}/pagesExt/ext-2.2.1/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/pagesExt/ext-2.2.1/ext-all.js"></script>
<script type="text/javascript" src=""${pageContext.request.contextPath}/pagesExt/ext-2.2.1/ext-all-debug.js"> </script>
</head>
<script type="text/javascript">
Ext.onReady(function(){
//定义数据集对象
var typeStore = new Ext.data.Store({//配置分组数据集
autoLoad :{params : {start:0,limit : 6}},
//默认加载参数:start=0,limit=6
reader: new Ext.data.JsonReader({
totalProperty: "results",
root: "items",//和action的list的名称一致。
id: "id"
},
Ext.data.Record.create([
//对一个po的属性名称
{name: 'id'},
{name: 'title'},
{name: 'detail'}
])
),
proxy : new Ext.data.HttpProxy({
//URL:struts.xml中配置该action
url : 'getDataList.action'
})
})
//分页工具栏
var pagingBar = new Ext.PagingToolbar({//分页工具栏
store : typeStore,
pageSize :6,//每页显示的条数。用于系统自动计算它的start值
displayInfo : true,
displayMsg : '数据从第{0}条 - 第{1} 条 共 {2}条数据',
emptyMsg : "没有记录"
})
//创建Grid表格组件
var cb = new Ext.grid.CheckboxSelectionModel()
var bookTypeGrid = new Ext.grid.GridPanel({
applyTo : 'grid-div',//定位到id=“grid-div”
frame:true,
store: typeStore,//与前面定义的数据存储器名称一致
width:580,
height:400,
viewConfig : {
autoFill : false
},
sm:cb,
columns: [//配置表格列
new Ext.grid.RowNumberer({
header : '行号',
width : 50
}),//表格行号组件
cb,
{header: "编号", width: 50, dataIndex: 'id', sortable: true},
{header: "名称", width: 150, dataIndex: 'title', sortable: true},
{header: "说明", width: 250, dataIndex: 'detail', sortable: true}
],
//分页工具栏
bbar: pagingBar//分页引用,作为button。前面有定义
})
});
</script>
<body>
<div id='grid-div'/>
</body>
</html>
发表评论
-
Extjs-GridPanel面板(原创)
2010-01-08 09:41 6701用GridPanel做了一个小的练习,也是方便大家对GridP ... -
ExtJS 表格面板GridPanel完整例子
2010-01-07 12:45 13489ExtJS中的表格功能非常 ... -
extjs分页
2010-01-06 15:43 1731<!DOCTYPE HTML PUBLIC " ... -
extjs2.0:GridPanel分页例子
2010-01-06 14:05 2805<!DOCTYPE html PUBLIC " ... -
Extjs2.0之GridPanel基本表格
2010-01-05 15:17 1423<!DOCTYPE html PUBLIC " ... -
Ext.Panle Ext.TabPanel Ext.Viewport2
2010-01-05 14:26 1227<link rel="stylesheet&q ... -
extjs 之Ext.Panle Ext.TabPanel Ext.Viewport
2010-01-05 14:16 1926<link rel="stylesheet&q ... -
extjs 之Border区域布局
2010-01-05 14:09 1255<link rel="stylesheet&q ... -
extjs 之显示一个窗口
2010-01-05 13:58 1091<link rel="stylesheet&q ... -
extjs之panel面板
2010-01-05 13:50 1186<link rel="stylesheet&q ... -
extjs 之helloworld
2010-01-05 13:44 1569<link rel="stylesheet&q ...
相关推荐
Ext_Js分页示例代码详解.pdfExt_Js分页示例代码详解.pdf
Ext_Js分页显示案例详解
ext分页查询ext分页查询ext分页查询ext分页查询ext分页查询ext分页查询ext分页查询ext分页查询ext分页查询ext分页查询ext分页查询ext分页查询ext分页查询ext分页查询ext分页查询ext分页查询ext分页查询ext分页查询...
分页EXT分页EXT分页EXT分页EXT分页EXT分页EXT分页EXT分页EXT分页EXT分页EXT
通过 json 接收后台数据,在前台分页显示数据,这只是我整的一个例子哦,就是 dwr+ext
可以直接在本地对数据进行分页显示,很强大!!!!(分页可以是JSON格式 也可以是Array格式)
ext 实例 示例 实例 示例 ext 实例 示例 实例 示例
《快意编程:Ext JS Web开发技术详解》首先对Ext JS进行了概述,然后通过一个简单的示例带领读者快速入门,在读者对Ext JS有了初步印象后,又重点介绍了JavaScript的面向对象技术、Ext JS API文档的使用方法、Ext JS...
Ext grid PagingToolbar分页实例源码Ext grid PagingToolbar分页实例源码Ext grid PagingToolbar分页实例源码Ext grid PagingToolbar分页实例源码
Ext.js 6 示例学习,内有一中文文档及一英文文档,供大家学习
JS的表格分页小工具代码,自己开发遇到需求时候开发的,只有分页功能,EXT表格的迷你版。有问题到:http://blog.csdn.net/ben_gmail/article/details/6585141留言谢谢。
ext分页 不写Java代码 自己可以用于项目
ext-js示例代码 ext-js示例代码 ext-js示例代码
Ext分页排序 Ext分页排序 Ext分页排序
《快意编程:Ext JS Web开发技术详解》首先对Ext JS进行了概述,然后通过一个简单的示例带领读者快速入门,在读者对Ext JS有了初步印象后,又重点介绍了JavaScript的面向对象技术、Ext JS API文档的使用方法、Ext JS...
EXT dojoChina按钮控件示例 Ext.Button.rarEXT dojoChina按钮控件示例 Ext.Button.rarEXT dojoChina按钮控件示例 Ext.Button.rarEXT dojoChina按钮控件示例 Ext.Button.rar
《快意编程:Ext JS Web开发技术详解》首先对Ext JS进行了概述,然后通过一个简单的示例带领读者快速入门,在读者对Ext JS有了初步印象后,又重点介绍了JavaScript的面向对象技术、Ext JS API文档的使用方法、Ext JS...
《快意编程:Ext JS Web开发技术详解》首先对Ext JS进行了概述,然后通过一个简单的示例带领读者快速入门,在读者对Ext JS有了初步印象后,又重点介绍了JavaScript的面向对象技术、Ext JS API文档的使用方法、Ext JS...
后台使用的是struts2生成Ext所需要的json,把webroot下的ext4下面加入ext的开发包,然后再把create.sql中的脚本在数据库中执行,代码就可以跑起来了,我用的是mysql数据库
用EXT来实现下拉框ComboBox 下拉框可以实现分页