简单的ext弹窗登录事件

缺乏、安全感 2022-05-28 05:47 202阅读 0赞

<span id="span_user" οnclick="f_plogin()">登录</span>

function f_plogin(){
    	var login_form=new Ext.form.FormPanel({
    		url : path+'/user!plLgin.ec',
    		labelAlign : 'right',
    		labelWidth : 100,
    		bodyStyle : 'padding:5px',
    		border : false,
    		baseCls: 'x-plain',
    		defaults: {width:200,xtype:'textfield',allowBlank:false},
        	items : [{
        		fieldLabel:'用户名',name:'username'},{
        		fieldLabel:'密码',name:'password',inputType:'password'}
    		 ]
    	
    	});
    	var login_win=new Ext.Window({
    		closeAction : 'close',
    		resizable : false,
    		modal:true,
    		width:400,
    		iconCls:'icon-key',
    		title:'登录',
    		autoHeight:true,
    		items:[login_form],
    		buttons:[{text:'登 录',handler:function(){
    			if(login_form.getForm().isValid()){
    				login_form.getForm().submit({
    					scope : this,
    					waitTitle:'登录中',
    					waitMsg : '登录中...',
    					success : function(form, action) {
    						//alert('登录成功!');
    						login_win.close();
    						location.reload();
    					},
    					failure : function(form, action) {
    						alert('登录失败，用户名或密码错误!');
    					}
    				});
    			}else{
    				alert('请输入用户名或密码!');
    			}
    		}}]
    	});
    	login_win.show();
    }

需要引入的插件：

<link rel="stylesheet" type="text/css" href="/resources/css/ext-all.css"/>
    <script src="/resources/ext-base.js" type="text/javascript"></script>
    <script src="/resources/ext-all.js" type="text/javascript"></script>

下载地址：

https://download.csdn.net/download/qq\_25391785/10318013

发表评论取消回复

表情：

评论列表（有 0 条评论，202人围观）

还没有评论，来说两句吧...

相关阅读

相关 Vue弹窗的使用之关闭弹窗

![在这里插入图片描述][1b80f7d3deec4b409ea303d03692d050.png_pic_center] [1b80f7d3deec4b409ea303d

不念不忘少年蓝@/ 2023年10月03日 23:46/ 0 赞/ 61 阅读

相关 EXT中创建一个弹窗效果

调用弹窗的代码第一种弹窗：一级弹窗 ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_a

电玩女神/ 2023年07月25日 12:59/ 0 赞/ 9 阅读

相关在EXT中向弹窗传值或者对象

在EXT中向弹窗传值(数组结构) 利用record属性来传输retList这个值 new slms.ShowPassword({

刺骨的言语ヽ痛彻心扉/ 2023年07月25日 12:56/ 0 赞/ 4 阅读

相关 html简单组件（二）：简洁弹窗

html简单组件（二）：简洁弹窗代码实现效果图为： ![在这里插入图片描述][20201230192642578.gif] html代码 <div>

r囧r小猫/ 2023年01月01日 02:52/ 0 赞/ 219 阅读

相关 easyUi Dialog弹窗的自带关闭事件

$("helpDialog_system").show().dialog({ modal: true,

本是古典何须时尚/ 2022年12月01日 01:24/ 0 赞/ 479 阅读

相关 html+css+js实现简单的弹窗

// 代码 <!doctype html> <html lang="en"> <head> <meta charset="UTF

偏执的太偏执、/ 2022年11月29日 11:42/ 0 赞/ 186 阅读

相关七、js点击弹窗弹出登录框代码

文章目录七、js点击弹窗弹出登录框代码 7.1 图片预览 7.2 index.html代码 --------------------

小鱼儿/ 2022年11月14日 00:48/ 0 赞/ 511 阅读

相关样式集（八）弹窗，规则弹窗，半透明弹窗

效果图： ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3

待我称王封你为后i/ 2022年11月05日 05:27/ 0 赞/ 327 阅读

相关简单的ext弹窗登录事件

<span id="span_user" οnclick="f_plogin()">登录</span> function f_plogin(){ v

缺乏、安全感/ 2022年05月28日 05:47/ 0 赞/ 203 阅读

相关 uniapp自定义简单弹窗组件

前面写android混编学到了很多，没有时间全部积累起来，后面会慢慢记录的。最近很久没有记录了，因为一个新的uniapp的项目。最近在做这个。看了智慧团建上的弹窗很喜欢

超、凢脫俗/ 2021年11月02日 07:30/ 0 赞/ 931 阅读