Ext登陆窗口代码,关键代码位于 login.js 中
html代码:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>样例</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">
<link rel="stylesheet" type="text/css"
href="../ext/resources/css/ext-all.css">
<script type="text/javascript" src="../ext/ext-base.js"></script>
<script type="text/javascript" src="../ext/ext-all.js"></script>
<SCRIPT type="text/javascript" src="../js/login.js"></SCRIPT>
<link rel="stylesheet" type="text/css" href="../ext/resources/css/xtheme-slate.css" />
<SCRIPT type="text/javascript" src="../ext/ext-lang-zh_CN.js"></SCRIPT>
<script type="text/javascript">
Ext.onReady(function()
{
Ext.MessageBox.alert('haha','o(∩_∩)o...哈哈');
})
</script>
</head>
<body>
</body>
</html>
login.js 代码:
Ext.onReady(function(){
//开启表单提示
Ext.QuickTips.init();
//设置提示信息位置为边上
Ext.form.Field.prototype.msgTarget = 'side';
var win = new Ext.Window({
id:'login-win',
title:'登陆',
iconCls:'tabs',
width:300,
height:120,
collapsible: true,
plain: true,
//初始化表单面板
items:new Ext.form.FormPanel({
id:'login-form',
labelWidth:50, // 默认标签宽度板
labelAlign:'right',
buttonAlign:'center',
//不设置该值,表单将保持原样,设置后表单与窗体完全融合
baseCls:'header',
layout:'form',
defaults:{
width:200
},
//默认字段类型
defaultType:'textfield',
items:[{
id:'username',
fieldLabel:'账号',
allowBlank:false//禁止为空
},{
id:'password',
inputType:'password',
fieldLabel:'密码',
allowBlank:false
}],
//初始化按钮
buttons:[{
text:'登陆',
type:'submit',
handler:function(){
var but=this;
but.setDisabled(true);
this.setText('正在登陆');
//将表单提交
Ext.getCmp('login-form').getForm().submit({
url:'/XXX/login.action',
method:"POST",
success:function(form,action){
document.location='/XXX/main.jsp';
},
failure:function(){
but.setText("登陆");
but.setDisabled(false);
}
});
}
}]
})
});
//将窗口显示出来
win.show();
});
分享到:
相关推荐
在EXT 2.0的压缩包文件"ext-2.0"中,可能包含了EXT库的JavaScript文件、CSS样式文件、图像资源以及示例代码等,开发者可以通过这些资源学习EXT 2.0的使用方法,快速上手并创建自己的富互联网应用。通过深入理解和...
EXT 2.0是EXT库的一个早期版本,它包含了一系列用于构建用户界面的组件和工具,如表格、面板、菜单、窗口等。EXT 2.0项目源代码的分享为开发者提供了一个深入了解EXT框架内部工作原理和最佳实践的机会。 在EXT 2.0...
Ext 2.0是Sencha公司开发的一个JavaScript库,主要用于构建富互联网应用程序(RIA)。这个中文文档包含了关于Ext 2.0的详细说明,对于开发者来说是一个非常宝贵的资源,可以帮助他们理解和使用这个强大的前端框架。 ...
Ext 2.0是一个强大的JavaScript库,专门用于构建富客户端应用程序。它是一个基于Ajax技术的开发框架,Ajax...在压缩包文件"ext2"中,可能包含了Ext 2.0的源代码、示例、文档和其他相关资源,供开发者学习和使用。
1. **组件系统**:EXT 2.0拥有一个强大的组件模型,包括窗口(Window)、表格(Grid)、面板(Panel)、按钮(Button)等。这些组件可以方便地组合和嵌套,实现复杂界面布局。 2. **数据绑定**:EXT 2.0支持数据...
"Demos_Ext2.0.rar"可能包含了EXT2.0的官方示例代码,这些示例通常涵盖了框架的各个功能模块,包括基本组件的使用、数据绑定、Ajax通信、布局管理、拖放操作以及各种高级功能的演示。通过学习和研究这些示例,开发者...
2. **数据绑定**:EXT2.0引入了数据绑定的概念,使得视图与模型之间的数据同步变得简单,减少了代码量,提高了代码的可维护性。 3. **强大的布局系统**:EXT2.0拥有多种布局管理器,如fit布局、border布局、form...
1. **组件系统**:EXT2.0拥有强大的组件体系,包括窗口(Window)、面板(Panel)、表格(Grid)、表单(Form)、树形控件(Tree)等。每个组件都有其特定的属性、配置选项、事件和方法,这些在API文档中都有详细的...
1. **组件化设计**:EXT2.0提供了一套完整的组件系统,包括表格、面板、表单、树形视图、菜单、窗口等,这些组件可以组合起来构建复杂的用户界面。 2. **数据绑定**:EXT2.0支持数据绑定,允许将视图组件与数据模型...
总而言之,EXT2.0帮助文档CHM版是一个全面且实用的资源,对于那些致力于使用EXT开发Web应用程序的人来说,它是提高效率、优化代码的重要参考资料。无论你是新手还是经验丰富的EXT开发者,这个文档都会成为你的得力...
EXT2.0是一款基于JavaScript的富客户端框架,用于构建现代Web应用程序。它提供了一系列强大的组件,包括数据网格、表格、窗口、菜单等,使得开发者能够创建功能丰富的、交互性强的用户界面。在"EXT2.0 带无限极树的 ...
EXT手册.CHM是EXT2.0的官方文档,它包含了详尽的API参考、示例代码以及教程,是学习和掌握EXT2.0的关键资源。CHM文件是Microsoft编写的帮助文件格式,通常用于存放技术文档和教程,方便离线查阅。 EXT js的组件系统...
这样的资源通常会涵盖EXT2.0的基本组件,如表格(Grid)、面板(Panel)、窗口(Window)、菜单(Menu)等,以及布局管理、数据绑定、事件处理等方面的知识。 ExtJS学习.pdf则可能是另一个EXT JS的学习资料,可能...
EXT2.0的核心是它的组件模型,它提供了一系列丰富的用户界面组件,如表格、面板、窗口、菜单等,使得开发者可以轻松地创建交互式和富用户体验的网页应用。 EXT2.0入门教程主要会涵盖以下几个关键知识点: 1. **EXT...
EXT2.0-API.chm文件是一个CHM(Microsoft HTML Help)格式的文档,通常包含详细的类参考、示例代码和教程。通过这个文档,开发者可以查找特定类的详细信息,包括类的构造函数、方法、属性、配置项和事件。例如,你...
1.3. 看看ext-2.0的文档 1.4. 为什么有的例子必须放在服务器上才能看到效果? 1.5. 为什么自己按照例子写的代码,显示出来总找不到图片 1.6. 我们还需要什么? 1.7. 入门之前,都看helloworld。 1.7.1. 直接使用下载...
EXT2.0是EXT框架的一次重大更新,它带来了许多改进和新功能,旨在提高开发者的体验和应用程序的性能。以下是对EXT2.0中关键知识点的详细解释: 1. **组件模型 (Component Model)**: 在EXT2.0中,Component和...
EXT2.0和EXT2.3是EXT库的两个重要版本,提供了丰富的用户界面组件和强大的数据管理功能。这篇教程旨在帮助新手快速掌握EXT的使用,从而在Web开发中实现更加交互性强、功能完善的页面。 EXT2.0是一个重要的里程碑,...