extjs和asp的完美结合！
extjs是一个比较美观的JS框架，是实现富客户端编程的较为理想的框架通过以下示例，可看出是可以与ASP完美的结合，并非是.NET PHP JAVA才能实现的（应该是说EXTJS基于客户端编程，与服务器端编程无关）
程序代码：代码：
<html>
<head>
<metahttp-equiv="Content-Type"content="text/html; charset=utf-8">
<title>登陆</title>
<script type="text/javascript"src="js/extjs/ext-base.js"></script>
<script type="text/javascript"src="js/extjs/ext-all.js"></script>
<script type="text/javascript"src="js/extjs/ext-lang-zh_CN.js"></script>
<link rel="stylesheet"type="text/css"href="js/extjs/resources/css/ext-all.css">
</head>
<script type="text/javascript">
Ext.BLANK_IMAGE_URL="js/extjs/resources/images/default/s.gif";
Ext.QuickTips.init();
Ext.onReady(function (){
scode=function(){
Ext.getDom("imgcode").src="Code.asp?dt=" + (new Date()).getTime();
}
var LGForm=new Ext.FormPanel({
el:'hello-tabs',
name:'LGForm',
title:'用户登录(User Login)',
bodyStyle:"padding:10 5 10 5px",
contentEl:'loginInfo',
layout:'form',
frame:true,
border:false,
keys:[{key: [10,13],fn:Pass}],
defaults:{
width:230
},
items:[{
xtype:"textfield",
fieldLabel:'帐号(ID??)',
name:'username',
allowBlank:false
},
{
xtype:"textfield",
fieldLabel:'密码(?? ??)',
name:'password',
inputType:'password',
allowBlank:false
},
{
xtype:'panel',
defaults:{border : false,frame:false},
style:'border-left: 0px solid #000000;',
width:420,
layout:'column',
items:[{
columnWidth:.6,
layout : 'form',
items:[{ xtype:'textfield',
width:180,
fieldLabel : '验证码(????)',
name : 'verifycode',
allowBlank:false,
anchor : '98%'}]
},{
xtype:'panel',
columnWidth:.4,
html:"<a href='javascript:scode()'><img src='Code.asp' id='imgcode' width='50' height='20'></a>"
}]
}
]
});
var _window=new Ext.Window({
el:'hello-win',
frame:true,
width:420,
height:278,
layout:"fit",
closeAction:'close',
modal:true,
collapsible:true,
draggable:true,
resizable:false,
closable:true,
buttonAlign:"center",
bodyStyle:"padding:1 1 1 1px",
labelWidth:40,
items:[LGForm],
buttons:[{
text:"登 陆(Login)",
handler:Pass
},
{
text:"关 闭(Close)",
handler:function () {
_window.close();
}
}]
});
function Pass () {
if(LGForm.form.isValid()) {
LGForm.form.submit({
url:'login_post.asp',
waitTitle:"请稍候",
method:'POST',
waitMsg:"正在提交数据,请稍候....",
success:function (form,action) {
var loginResult=action.result.success;
if(loginResult==false) {
Ext.MessageBox.alert('提示',action.result.message);
}else if(loginResult==true) {
window.location.href='main.html';
}
},
failure:function (form,action) {
Ext.MessageBox.alert('提示',action.result.message);
//_window.getComponent('LGForm').form.reset();
}
});
}
}
_window.show();
});
</script>
<body>
<div id="center-zone"style="text-align:center;float:center;margin-left:400px;margin-top: 200px;width:210px;"></div>
<div id="hello-win" class="x-hidden">
<div id="hello-tabs"><img src="images/coc.jpg" width="405" align="center"></div>
<div id='loginInfo'></div></div>
</body>
</html>
更多的关于ASP与EXTJS的编程，可到我的博客一看: blog.
[ 本帖最后由 bluegone 于 2010-11-22 22:24 编辑 ]
