<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>My JSP 'index.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<link rel="stylesheet" type="text/css" href="css/resources/css/ext-all.css" />
<script type="text/javascript" src="js/ext-base.js"></script>
<script type="text/javascript" src="js/ext-all.js"></script>
<script type="text/javascript" src="js/ext-lang-zh_CN.js"></script>
<script type="text/javascript">
function extDemo()
{
Ext.MessageBox.alert('hello world','hello world');
}
Ext.onReady(function(){
//事件监听
var but1=Ext.get("b1");
but1.on('click',function(){
Ext.Msg.alert("show click","点了b1");
})
//监测浏览器窗口大小的改变
Ext.EventManager.onWindowResize(function(width,height)
{
//alert('width:'+width+';height:'+height);
})
//监测浏览器文字大小的改变
Ext.EventManager.onTextResize(function(oldSize,newSize)
{
alert('oldsize:'+oldSize+';newSize:'+newSize);
})
//判断用户是否按了空格
Ext.get("text").on('keypress',function(e){
if(e.charCode==Ext.EventObject.SPACE)
{
Ext.Msg.alert('info','按下了空格键');
}
});
//判断用户的鼠标滚轮操作(只支持ie)
Ext.get(document.body).on('mousewheel',function(e){
var delta=e.getWheelDelta();
var test=Ext.get('text');
var width=test.getWidth();
test.setWidth(width+delta*100,true);
});
//生成一个Ext BoxComponet
var box=new Ext.BoxComponent({
el:'test',
style:'background-color:red;position:absolute;',
pageX:100,
pageY:50,
width:200,
height:150
});
//box.render();
//Ext.Panel
var panel=new Ext.Panel({
el:'test',
title:'测试标题',
floating:true,
shadow:true,
draggable:true,
collapsible:true,
html:'测试内容',
pageX:100,
pageY:50,
width:200,
height:150
});
//panel.render();
//Ext.TabPanel
var tabs=new Ext.TabPanel({
//renderTo:document.body,
height:100
});
tabs.add({
title:'标题1',
html:'内容1'
});
tabs.add({
id:Ext.id(),
title:'标题2',
html:'内容2',
closable:true
});
//autoLoad默认使用延时加载,激活时才加载
tabs.add({
title:'表格'+id,
closable:true,
layout:'fit',
autoLoad:{url:'1.jsp',scripts:true}
});
tabs.activate(2);
//Ext.Grid 表格控件
//定义复选框,并且重设选择处理函数
// var sm=new Ext.grid.CheckboxSelectionModel({handleMouseDown:Ext.emptyFn});
//定义选择模型
var sm=new Ext.grid.RowSelectionModel({singleSelect:true});
//定义表结构
var cm=new Ext.grid.ColumnModel([
//自动显示行号
//new Ext.grid.RowNumberer(),
//复选框
//sm,
{header:'编号',dataIndex:'id',sortable:true,editor:new Ext.grid.GridEditor(new Ext.form.TextField({
allowBlank:false
}))},
{header:'roomno',dataIndex:'name',sortable:true,editor:new Ext.grid.GridEditor(new Ext.form.TextField({
allowBlank:false
}))},
{id:'descn',header:'accnt',dataIndex:'descn',sortable:true,editor:new Ext.grid.GridEditor(new Ext.form.TextField({
allowBlank:false
}))},
{header:'性别',dataIndex:'sex',renderer:function(value){
if(value=='male')
{
return "<span style='color:red'>男</span>";
}else
{
return "<span style='color:green'>女</span>";
}
},editor:new Ext.grid.GridEditor(new Ext.form.TextField({
allowBlank:false
}))}
]);
//定义存储
var store=new Ext.data.Store({
//proxy:new Ext.data.MemoryProxy(data),
proxy:new Ext.data.HttpProxy({url:'extGrid.action'}),
reader:new Ext.data.JsonReader({
totalProperty:'totalProperty',
root:'topic'},
[
{name:'id'},
{name:'name'},
{name:'descn'}
])
});
//装配数据,创建可编辑的表格数据
var grid=new Ext.grid.EditorGridPanel({
//渲染名称为grid的div
renderTo:'grid',
store:store,
cm:cm,
sm:sm,
height:350,
//斑马线
stripeRows:true,
//遮罩
loadMask:true,
//自动计算所有列的宽度
viewConfig:{
forceFit:true
},
//只适应某一列的宽度,需要定义表结构的时候指定id
autoExpandColumn:'descn',
//分页
bbar:new Ext.PagingToolbar({
pageSize:10,
store:store,
displayInfo:true,
displayMsg:'显示第{0}条到第{1}条记录,一共{2}条',
emptyMsg:'没有记录'
}),
tbar: [{
text: 'Add Plant',
handler : function(){
// access the Record constructor through the grid's store
var Plant = grid.getStore().recordType;
var p = new Plant({
id: '1',
name: 'Mostly Shade',
descn:'descn nnn',
});
grid.stopEditing();
store.insert(0, p);
grid.startEditing(0, 0);
}},
{
text:'Remove Employee',
handler:function()
{
grid.stopEditing();
var s=grid.getSelectionModel().getSelections();
for(var i=0,r;r=s[i];i++)
{
store.remove(r);
}
}
}
]
});
store.load({params:{start:0,limit:10}});
//如果删除某一行,刷新表格,让序列号连续
grid.view.refresh();
/**
//弹出选择的信息
grid.on('click',function(){
var selections=grid.getSelectionModel().getSelections();
for(var i=0;i<selections.length;i++)
{
var record=selections[i];
Ext.Msg.alert('信息',record.get("id")+","+record.get("name")+","+"descn"+record.get("descn"));
}
})
*/
//表单控件
var form = new Ext.form.FormPanel({
baseCls: 'x-plain',
layout:'absolute',
url:'saveform.action',
defaultType: 'textfield',
items: [{
x: 0,
y: 5,
xtype:'label',
text: 'Send To:'
},{
x: 60,
y: 0,
name: 'id',
anchor:'80%' // anchor width by percentage
},{
x: 0,
y: 35,
xtype:'label',
text: 'Subject:'
},{
x: 60,
y: 30,
name: 'name',
anchor: '100%' // anchor width by percentage
},{
x:0,
y: 60,
xtype: 'textarea',
name: 'descn',
anchor: '100% 100%' // anchor width and height
}]
});
var window = new Ext.Window({
title: 'Resize Me',
width: 500,
height:300,
minWidth: 300,
minHeight: 200,
layout: 'fit',
plain:true,
bodyStyle:'padding:5px;',
buttonAlign:'center',
items: form,
buttons: [{
text: 'Send',
handler:function(){
form.getForm().submit({
success:function(form,action)
{
Ext.Msg.alert('信息',action.result.msg);
grid.getStore().reload();
},
failure:function()
{
Ext.Msg.alert('信息','操作失败');
}
});
}
},{
text: 'Cancel'
}]
});
window.show();
})
</script>
</head>
<body>
<input type="button" value="a" onclick="extDemo()"/><br>
<input type="button" value="1" id="b1"/>
<input type="button" value="2" id="b2"/>
<input type="button" value="3" id="b3"/>
<input type="text" id="text" width="10"/>
<div id='test'></div>
<div id="grid" style="autoHeight:true"></div>
</body>
</html>
分享到:
相关推荐
7z是一种高压缩率的文件存档格式,由7-Zip软件创建,能有效地存储大量数据。 【ext】标签可能是指"Extension",在IT领域中通常指的是为现有软件或平台添加额外功能的模块或插件。在这种情况下,"ext"可能代表了一个...
在这个场景下,"grid打印"指的是将Grid中的数据导出或者可视化地呈现到纸上,以便于用户进行查阅或存档。这通常涉及到打印预览,确保数据在打印时的布局和样式与在屏幕上显示的一致。 复杂表头打印是这个功能的一个...
Ext 2 API 文档是关于ExtJS框架的一个关键资源,它为...总之,"Ext 2 API Documentation.zip"是一个全面的开发工具,为使用ExtJS 2.0开发Web应用的程序员提供了详尽的参考资料和实例,有助于提升开发效率和代码质量。
7z是一种高压缩比的文件存档格式,由7-Zip软件创建。7-Zip提供了对多种压缩算法的支持,如LZMA和PPMd,使得压缩后的文件体积更小,尤其适用于大文件的存储和传输。与常见的ZIP或RAR格式相比,7z在压缩率上通常有显著...
:red_exclamation_mark: 该存储库已存档。 :red_exclamation_mark: 它将在这里维护: : CDPR Cyberpunk 2077电子游戏的改装工具。 最新稳定版本 最新测试版 :red_exclamation_mark: 需要NET5.0。 (如果...
FAT、NTFS、EXT系列等文件系统各有特点,NTFS支持大文件和权限管理,更适合多媒体数据。在存档过程中,保持良好的文件命名和分类习惯至关重要,以便于日后检索。此外,文件压缩可以节省存储空间,但需要权衡压缩效率...
它支持各种存档和压缩格式。 它还支持仅压缩的文件(例如foo.gz)。 所有这些都归功于伟大的项目。 您可以通过CWS安装它: :支持的格式请注意,我们支持存档(压缩或未压缩),并且我们支持单个压缩文件(没有存档...
由于不同品牌电脑进入BIOS的方法各异,你需要自行查阅相关资料。如果在安装过程中出现提示虚拟化未开启,可以再返回BIOS设置。若一切顺利,这一步骤就不需要额外操作。 接下来,在虚拟机软件(例如VMware)中创建新...
如果想要将数据从ReadyNAS备份到USB硬盘,需确认USB设备已正确连接,文件系统格式为Ext2/3或FAT32,并且可以正常访问。 在两台ReadyNAS之间进行镜像备份,可以通过启用rsync协议并在每台设备上创建备份任务,将对方...
此处找到的版本仅用于存档目的。 ====一个newLISP-www.newlisp.org-宏,它使用户可以内联“定义”可调用的外部代码,就像他们“定义” lambda或宏一样。 C,包括汇编语言和普通对象代码插件。 对象代码插件没有外部...
FwAnalyzer(固件分析器)FwAnalyzer是使用一组可配置规则来分析(ext2 / 3/4),FAT / VFat,SquashFS,UBIFS文件系统映像,cpio存档和目录内容的工具。 FwAnalyzer依靠e2tools作为前FwAnalyzer(固件分析器)...
UnifiedArchive可以利用它来处理尽可能多的格式: ZipArchive,RarArchive,PharData 梨/焦油通过Gemorroj / Archive7z的7zip CLI程序通过Alchemy / Zippy的zip,tar cli程序ext-zlib,ext-bz2,ext-x
首先,从Liferay的官方仓库或互联网上的存档站点下载Liferay Portal 5.2.3的源码包。这通常包含了一个解压后即可运行的基础实例和相关的构建工具。 2.2 开发工具 选择一款适合的集成开发环境(IDE)对开发效率至关...
在VC++编程环境中,获取文件属性是一项常见的任务,这包括了解文件的创建时间、修改时间、访问时间,以及文件的权限信息,如只读、存档、隐藏和系统属性。以下是一个详细的步骤介绍和相关代码示例。 首先,我们需要...
#steamid-转换器Steam 的 ID 格式之间的简单转换,以及验证需要各种 Steam ID 格式的输入的示例(实际上不是由这个库处理的,但我想,嘿,当我用 Regex 做事时......”)。... </ script ><...
j2n描述从 Java 存档文件 (.jar) 生成 C++/JNI 包装器。安装 go get github.com/mtojo/j2n用法 j2n -i file选项: -i <file> input jar file-o <dir> output directory; same as input if not specify-f overwrite ...
fsarchiver可以处理多种文件系统类型,包括EXT2/3/4、XFS、Btrfs、ReiserFS等。 **主要特性** 1. **完整性与安全性**: fsarchiver使用CRC校验来确保存档文件在传输或存储过程中的数据完整性。同时,它支持在存档...
Dar保存* all * UNIX inode类型,处理硬链接,稀疏文件以及扩展属性(MacOS X文件派生,Linux ACL,SELinux标记,用户属性)和某些文件系统特定的属性(Linux ext2 / 3/4, Mac OS X HFS +)的更多详细信息,请访问...
Dar 保存*所有* UNIX inode 类型,处理硬链接、稀疏文件以及扩展属性(MacOS X 文件分支、Linux ACL、SELinux 标签、用户属性)和一些文件系统特定属性(Linux ext2/3/4、 Mac OS X HFS+)更多详细信息,请访问:...