没有合适的资源？快使用搜索试试~ 我知道了~

首页ExtJs+Dwr带分页分组传参后台排序功能的grid

ExtJs+Dwr带分页分组传参后台排序功能的grid

ExtJS

grid

5星 · 超过95%的资源需积分: 10 14 下载量 200 浏览量更新于2023-03-16 评论收藏 208KB DOCX 举报

身份认证购VIP最低享 7 折!

领优惠券(最高得80元）

试读

30页

ExtJs+Dwr带分页分组传参后台排序功能的grid 主要包含：这个主要用到ExtJS+DWR+Spring+Hibernate,主要包括浏览页（usernamerecord.jsp），脚步文件（usernamerecord.js），dwr分页代理脚本文件（dwrproxy.js），实体类（Record.java），Dao接口（RecordDao），Dao类(RecordDaoImpl)，Service类（RecordServiceImpl），Service接口（RecordService），分页类（ListRange.java），dwr自带（engine.js），ext自带（ext-all.js,ext-base.js,ext-all.css）,(分页底部工具栏)PagingToolbar.js

资源详情

资源评论

资源推荐

ExtJs+Dwr 带分页分组传参后台排序功能的 grid

主要包含：这个主要用到 ExtJS+DWR+Spring+Hibernate, 主要包括浏览页

（ usernamerecord.jsp ），脚步文件（ usernamerecord.js ）， dwr 分页代理脚本文件

（ dwrproxy.js ），实体类（ Record.java ）， Dao 接口（ RecordDao ）， Dao 类

(RecordDaoImpl)，Service 类（RecordServiceImpl），Service 接口（RecordService），分页

类（ListRange.java），dwr 自带（engine.js），ext 自带（ext-all.js,ext-base.js,ext-all.css）,

(分页底部工具栏)PagingToolbar.js

显示结果：

usernamerecord.jsp 页面

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

String path = request.getContextPath();

String basePath = request.getScheme()+"://"+request.getServerName()

+":"+request.getServerPort()+path+"/";

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<title>My JSP 'usernamerecord.jsp' starting page</title>

href="ext-2.2.1/resources/css/ext-all.css"/>

src="/wangba/dwr/util.js"></script>

src="/wangba/dwr/engine.js"></script>

src="/wangba/dwr/interface/RecordService.js"></script>

src="jss/PagingToolbar.js"><</script>

</head>

<body>

</body>

</html>

'usernamerecord.js 文件

var wait;

var totalcost;

var size;

Ext.onReady(function(){

waiting();

Ext.BLANK_IMAGE_URL="ext-2.2.1/resources/images/default/s.gif";

var start=0;

var pageSize=18;

var sm = new Ext.grid.CheckboxSelectionModel();

var cm = new Ext.grid.ColumnModel([new Ext.grid.RowNumberer(),sm,

{

header : '编号',

dataIndex : 'recordid',

sortable : true

}, {

header : '用户编号',

sortable : true,

dataIndex : 'userid'

}, {

header : '用户名',

sortable : true,

dataIndex : 'username',

width:150

}, {

header : '机器号',

sortable : true,

dataIndex : 'computerid'

}, {

header : '上机时间',

sortable : true,

dataIndex : 'begintime',

width:230,

renderer: Ext.util.Format.dateRenderer('Y 年 m 月 d 日 H 时 i

分 s 秒')

}, {

header : '下机时间',

sortable : true,

dataIndex : 'endtime',

width:230,

renderer: Ext.util.Format.dateRenderer('Y 年 m 月 d 日 H 时 i

分 s 秒')

}, {

header : '消费金额',

sortable : true,

dataIndex : 'fee'

}]);

var recordType = new Ext.data.Record.create([{

name : 'recordid',

mapping : 'recordid',

type : 'int'

}, {

name : 'userid',

mapping : 'userid',

type : 'int'

}, {

name : 'username',

mapping : 'username',

type : 'string'

}, {

name : 'computerid',

mapping : 'computerid',

type : 'int'

}, {

name : 'begintime',

mapping : 'begintime',

type : 'date'

}, {

name : 'endtime',

mapping : 'endtime',

type : 'date'

}, {

name : 'fee',

mapping : 'fee',

type : 'float'

}]);

var proxy = new Ext.data.DWRProxy(RecordService.searchRecord,

true);

var ds = new Ext.data.GroupingStore({

proxy : proxy,

reader : new Ext.data.ListRangeReader({

id : 'recordid',

totalProperty : 'totalSize'

}, recordType),

remoteSort : true,

sortInfo : {

field : 'recordid',

direction : "ASC"

}

});

var paging=new Ext.PagingToolbar({

pageSize : 16,

//queryParams :{empName:''},

store : ds,

displayInfo : true,

displayMsg : '第 {0} ~ {1} 条 , 共 {2} 条 ',

emptyMsg : '无任何记录',

beforePageText :'第',

afterPageText :'页',

firstText : '第一条',

lastText : '后一条',

prevText : '上一条',

nextText : '下一条'

});

var grid = new Ext.grid.GridPanel({

title : '<center>按用户名查询记录</center>',

store : ds,

id:"grid",

cm : cm,

height:490,

layout:"fit",

stripeRows: true, //斑马线效果

loadMask: true, //读取数据时的遮罩和提示功能

view : new Ext.grid.GroupingView({

sortAscText : '正序排列',

sortDescText : '倒序排列',

columnsText : '列显示/隐藏',

groupByText : '根据本列分组',

showGroupsText : '是否采用分组显示',

groupTextTpl : '{text}(<b><font

color=red>{[values.rs.length]}</font></b> {[values.rs.length > 1 ?

"Items" : "Item"]})'

}),

tbar:[{

text:'<font size="3">请输入要查询的用户名</font>'

},{

xtype:'textfield',

id:"username",

name: 'username',

剩余29页未读，继续阅读

smileallenlong

2014-04-19

我想看的是ExtJS4 下的mvc模式与dwr的结合，这个不是很符合要求。

粉丝: 1
资源: 13

上传资源快速赚钱

我的内容管理收起

我的资源快来上传第一个资源

我的收益

登录查看自己的收益

我的积分登录查看自己的积分

我的C币登录后查看C币余额

我的收藏

我的下载

下载帮助

会员权益专享

ExtJs+Dwr带分页分组传参后台排序功能的grid

评论3

会员权益专享

最新资源

ExtJs+Dwr带分页分组传参后台排序功能的grid

评论3

ExtJS 实现动态处理加载 grid 实现了CRUD还有分页功能

ExtJs+Dwr(Grid)实现分页功能

extjs+dwr3.0实现文件上传

DWR+extjs+spring+hibernate

extjs+页面刷新

extjs+combobox三级联动

extjs 树形菜单 分页查看

Extjs4 grid按字段排序

extjs 列表 分页 样例

extjs 的grid表格数据修改后，后台数据也随之修改

extjs6做一个简单的分页

Extjs 通过分页代码，以及具体属性含义

extjs动态创建grid

extjs6+百度地图代码

extjs中grid.Panel和gird.Grid的区别

extjs grid表格导出excel的完整例子

Extjs从后台获取数据的方式

ExtJS的grid组件关闭自动加载

用extjs写一个grid表格数据修改后，后台数据也随之修改的完整例子

EXTjs如何让grid的 的CheckboxSelectionModel全部选中

会员权益专享

最新资源

extjs 树形菜单分页查看

extjs 列表分页样例

EXTjs如何让grid的的CheckboxSelectionModel全部选中