Ext2.0：Ext登陆窗口代码含验证码

最新推荐文章于 2021-05-30 11:13:06 发布

Carl_YC

最新推荐文章于 2021-05-30 11:13:06 发布

阅读量1.3k

点赞数

分类专栏： ExtJS专栏文章标签： ext stylesheet function tabs header action

本文链接：https://blog.csdn.net/wayfoon322/article/details/2632638

版权

ExtJS专栏专栏收录该内容

31 篇文章 0 订阅

订阅专栏

Ext登陆窗口代码，关键代码位于 login.js 中

html代码：

  
  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <title>wayfoon</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>

 
  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();
});
 
 

Carl_YC

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
Ext2.0：Ext登陆窗口代码含验证码

Ext登陆窗口代码，关键代码位于 login.js 中 html代码： html> head> title>wayfoontitle> meta http-equiv="pragma" content="no-cache"> meta http-equiv="cache-control" content="no-cache">
复制链接

扫一扫