- 浏览: 137410 次
- 性别:
- 来自: 重庆
最新评论
-
老梦a:
要是保存到数据库,是怎么做呢,数据流这块,不太懂。。(*^__ ...
使用flash摄像头拍照的简单实践 -
wolf521hf:
学习 最近正在看相关的文档 标记下
Spring安全权限管理(Spring Security) -
yue_hun1025:
怎么下载不了??????
java反编译工具jad下载 -
ry.china:
你把这个放到jdk的bin目录下就可以了
java反编译工具jad下载 -
幻樱释:
不知道能不能看懂哦。
javascript高级程序设计实例代码
有用的ext grid 例子 收藏
<script type="text/javascript"> document.body.oncopy = function() { if (window.clipboardData) { setTimeout(function() { var text = clipboardData.getData("text"); if (text && text.length>300) { text = text + "\r\n\n本文来自CSDN博客,转载请标明出处:" + location.href; clipboardData.setData("text", text); } }, 100); } } </script><script type="text/javascript">function StorePage(){d=document;t=d.selection?(d.selection.type!='None'?d.selection.createRange().text:''):(d.getSelection?d.getSelection():'');void(keyit=window.open('http://www.365key.com/storeit.aspx?t='+escape(d.title)+'&u='+escape(d.location.href)+'&c='+escape(t),'keyit','scrollbars=no,width=475,height=575,left=75,top=20,status=no,resizable=yes'));keyit.focus();}</script>
这几天才开始真真的学习extjs,以前有听说过,现在才发现,只要看懂后,发现extjs还是非常的强大,长话短说,实践开始。
对于extjs的常用js,这里就不提供下载了。
一、首先增加一个jsp页面grid3.jsp
<?
xml version="1.0" encoding="UTF-8"
?>
<%
@ page language
=
"
java
"
contentType
=
"
text/html; charset=UTF-8
"
pageEncoding
=
"
UTF-8
"
%>
<!
DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
>
<
html
xmlns
="http://www.w3.org/1999/xhtml"
>
<
head
>
<
meta
http-equiv
="Content-Type"
content
="text/html; charset=UTF-8"
/>
<
title
>
Grid3
</
title
>
<
link
rel
="stylesheet"
type
="text/css"
href
="extjs/resources/css/ext-all.css"
/>
<!--
<link rel="stylesheet" type="text/css" href="extjs/resources/css/xtheme-gray.css" />
-->
<
script
type
="text/javascript"
src
="extjs/adapter/ext/ext-base.js"
></
script
>
<
script
type
="text/javascript"
src
="extjs/ext-all.js"
></
script
>
<
script
type
="text/javascript"
src
="extjs/ext-lang-zh_CN.js"
></
script
>
</
head
>
<
body
>
<
script
type
="text/javascript"
src
="grid3.js"
></
script
>
<
div
id
="grid3"
style
="width: 100%;height: 100%"
>
</
div
>
</
body
>
</
html
>
二、增加一个js grid3.js /*
*
* @author fox
*/
Ext.onReady(
function
()
{
Ext.BLANK_IMAGE_URL
=
'
extjs/resources/images/default/s.gif
'
;
Ext.QuickTips.init();
var
sm
=
new
Ext.grid.CheckboxSelectionModel();
var
cm
=
new
Ext.grid.ColumnModel([
new
Ext.grid.RowNumberer(),
sm,
{header:
'
编号
'
,dataIndex:
'
id
'
,sortable:
true
}
,
{header:
'
名称
'
,dataIndex:
'
name
'
}
,
{header:
'
描述
'
,dataIndex:
'
descn
'
}
]);
//
proxy直接去读取josn数据
var
ds
=
new
Ext.data.Store(
{
proxy:
new
Ext.data.HttpProxy(
{url:
'
gridjson.jsp
'
}
),
reader:
new
Ext.data.JsonReader(
{
totalProperty:
'
totalProperty
'
,
root:
'
root
'
,
successProperty :
'
success
'
}
, [
{name:
'
id
'
,mapping:
'
id
'
,type:
'
int
'
}
,
{name:
'
name
'
,mapping:
'
name
'
,type:
'
string
'
}
,
{name:
'
descn
'
,mapping:
'
descn
'
,type:
'
string
'
}
])
}
);
var
grid
=
new
Ext.grid.GridPanel(
{
el:
'
grid3
'
,
ds: ds,
sm: sm,
cm: cm,
width:
700
,
height:
280
,
bbar:
new
Ext.PagingToolbar(
{
pageSize:
10
,
store: ds,
displayInfo:
true
,
displayMsg:
'
显示第 {0} 条到 {1} 条记录,一共 {2} 条
'
,
emptyMsg:
"
没有记录
"
}
)
}
);
//
el:指定html元素用于显示grid
grid.render();
//
渲染表格
ds.load(
{params:
{start:
0
, limit:
10
}
}
);
}
);
三、因为grid3.js里的数据是通过url:
'
gridjson.jsp
'
来读取的(实例用jsp比较方便),所以新建一个gridjson.jsp来产生json格式的数据
String start = request.getParameter( " start " );
String limit = request.getParameter( " limit " );
try {
int index = Integer.parseInt(start);
int pageSize = Integer.parseInt(limit);
String json = " {totalProperty:100,root:[ " ;
for ( int i = index; i < pageSize + index; i ++ ) {
json += " {id: " + i + " ,name:'name " + i + " ',descn:'descn " + i + " '} " ;
if (i != pageSize + index - 1 ) {
json += " , " ;
}
}
json += " ]} " ;
response.getWriter().write(json);
} catch (Exception ex) {
}
%>
这样,一个grid就出现了,值得注意的是,在grid.js里的
totalProperty: 'totalProperty',
root: 'root',
需要与gridjson.jsp里的相对应,要不然会出错
totalProperty是所有数据的条数
发表评论
-
数据库JDBC驱动下载大全
2017-03-26 14:14 20811.数据库驱动下载地址 Cache : http://w ... -
MINA粘包断包专题研究
2015-05-13 00:25 0一、前述: 近期做项目用到了MINA,其中遇到了一个 ... -
Mybatis版PropertyFilter实现
2014-07-03 23:50 1477<!--前段时间看到hibernate的Proper ... -
java字符串应用之表达式解析器
2013-12-26 13:33 5231一、表达式的组成 1、数字 2、运算符:+ - ... -
全文检索Lucene使用与优化
2012-03-22 13:09 922转自http://www.oecp.cn/hi/chengzh ... -
Spring 里JMS和DB的事务集成
2012-02-10 18:59 1668http://www.javaworld.com/jav ... -
Java实现在bmp图像文件中隐藏与导出信息
2011-08-21 00:20 1339BMP图像文件,即所谓的位图文件。在位图中,其表示方式是 ... -
Spring事务配置的五种方式
2011-06-10 20:07 971前段时间对Spring的事务配置做了比较深入的研究,在此之间对 ... -
spring2.5 mvc common-validator 集成应用
2010-12-10 12:59 2872常常写客服端验证代码,写多了就感觉是否有啥东西可以简化处理的, ... -
通过java2dAPI绘制报表
2010-12-05 21:41 1426/* *只画直线,矩形,椭圆,只能向右下角 ... -
调整 JVM 开关以提高性能
2010-12-04 16:29 1032http://blog.csdn.net/petehero/a ... -
CGlib简单介绍
2010-07-06 21:58 888转载:http://hacker0825.blog.163.c ... -
java开源论坛系统
2010-01-04 22:52 4137java开源论坛系统 ================ m ... -
纯jsp日历
2009-12-16 09:44 1143网上找了一大堆日历,感觉跟自己的想要的有点差别,索性自己修改了 ... -
tomcat6学习笔记( 包括和apache2的集成,集群,SSI,SSL,安全域,嵌入应用程序,访问控制平台和管理平台)
2009-12-15 11:27 2425一.访问tomcat的控制平台和管理平台 首先下载tom ... -
用p6spy来观察Java程序中执行的所有SQL语句
2009-11-17 15:30 2120本想把 p6spy 结合 SQL Pro ... -
Spring安全权限管理(Spring Security)
2009-11-04 14:02 6398Spring Security以前叫做acegi,是后来才成为 ... -
spring事务传播属性与隔离级别
2009-10-20 15:22 2049一、Propagation (事务的传播属性) Pro ... -
一个用Spring AOP实现异常处理和记录程序执行时间的实例
2009-10-20 15:05 31165.11 一个用Sprin ... -
最新的jsp系统与discuz整合(含源码)
2009-10-13 13:44 21981>登录discuz后台:UCenter应用管理---- ...
相关推荐
Ext grid中渲染进度条,超帅 源码-----下载不扣分,回帖加1分,欢迎下载,童叟无欺。Ext grid中渲染进度条,超帅 源码-----下载不扣分,回帖加1分,欢迎下载,童叟无欺。Ext grid中渲染进度条,超帅 源码-----下载不扣分...
extgrid 是一款jquery上的gird插件 界面风格采用了类似easyui extjs 界面风格样式 可通过css修改自己想要的样式 extgrid具有列大小 位置改变 排序 分组 分页 工具栏 扩展行 rowNumber 多选列 编辑列 行列锁 ajax...
Ext grid PagingToolbar分页实例源码Ext grid PagingToolbar分页实例源码Ext grid PagingToolbar分页实例源码Ext grid PagingToolbar分页实例源码
压缩包包含EXT3.2的源码和API。ExtTest项目为EXT的例子,包括增删改查的方法。绝对的运行的起来,总过路过,不要错过啊!
支持Ext3 Ext4导出excel,客户端导出表格,支持各种主流浏览器。
最新的GT-Grid vs EXT-Grid例子是用GT-Grid表格控件和EXT-Grid表格控件来进行比较、里面有三个例子、看了这后觉得这两种表格显示数据控件功能实在太强大啦..
官方例子 Ext grid filter
找了半天,结果在extjs的老家找到一个前辈写的代码,可以在grid上面加上合计, <br>但是却只能合计grid里面的数据,但是我们平常一般是只显示20行或者30行,这样的合计就没有什么意义,我们的合计数据是单独从...
Ext grid panel 滚动条位置不变,适用于实时数据的刷新
EXT GRID使用EXT GRID使用 EXT GRID使用EXT GRID使用
一个完整的ext中grid与tree的使用,是很好的一个学习例子.
dddddddddddddddddddddddddd
本实例使用官方Ext3.1包 ...1.创建简单快捷的Ext Grid控件 代码清晰 2.Grid 读取 Xml 3.Grid 读取 json 4.Grid 读取 Excel 5.直接在 Grid 控件进行增删改查的操作 有任何疑问的同志欢迎提出即可谢谢
NULL 博文链接:https://damen.iteye.com/blog/946039
Ext Grid表格的自动宽度及高度的实现
有用的grid' js 实现 哪来分享! grid js 例子一个 ext 的 grid js 例子一个 ext 的 grid js 例子一个 ext 的
用于Ext开发Grid中遇到的所锁列的问题,这个很有帮助
自己编写的EXT例子,grid、tree从数据库读取数据动态显示,并进行分页。可以动态更换主题,并存入cookies中。
EXT grid导出EXCEL,有事例,下载后直接可用
一个EXT GRID的实例。是一个人新增人员的BS界面形式的程序。很漂亮的界面风格,很人性化的功能支持。