Flask+LayUI开辟手记（二）：LayUI弹出层表单的校验 - ToB企服应用市场:ToB评测及商务社交产业平台

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>账户切换页面</title>
<link rel="stylesheet" href="/static/layui/css/layui.css" media="all">
</head>
<body>
<div style="padding:10px;">
<form class="layui-form layui-form-pane" action="" method="post" lay-filter="entryform" target="_top">
<div class="layui-form-item">
<label class="layui-form-label">账户名</label>
<div class="layui-input-block">
<input type="text" id="username" name="username" lay-verify="username" autocomplete="off" placeholder="请输入账户名" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">口令</label>
<div class="layui-input-block">
<input type="password" id="password" name="password" lay-verify="password" autocomplete="off" placeholder="请输入口令" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<input type="checkbox" id="online" name="online" title="记住密码" lay-skin="primary" checked>
</div>
<!--div class="layui-form-item">
<button class="layui-btn layui-btn-fluid layui-bg-blue"" lay-filter="loginSubmit" lay-submit>登录</button>
</div-->
</form>
</div>
<script src="/static/layui/layui.js"></script>
<script>
layui.use(['layer', 'form'], function () {
var $ = layui.jquery;
var layer = layui.layer;
var form = layui.form;
form.verify({
username: function(value) {
if (value.length < 4 || value.length>20) {
return '账户名长度必须在4~20之间';
}
},
password: function(value) {
if (value.length < 6 || value.length>9) {
return '密码长度为6到9位';
}
}
});
/*form.on('submit(loginSubmit)', function(data){
return false;
});*/
});
</script>
</body>
</html>

复制代码

//切换账户
$('#LAY_switch_acct').click(function(){
url = '/entry/'
layer.open({
type: 2,
title:'切换账户',
area: ['420px', '290px'], //宽高
skin: 'layui-layer-rim', //样式类名
content: url,
btn:['登录','关闭'],
yes: function(index, layero){
var iframeWin = window[layero.find('iframe')[0]['name']];
var vform = iframeWin.layui.form;
vform.submit('entryform',function(data){
console.log('data:' + JSON.stringify(data));
$.post(url,
data.field,
function(rs){
if(rs.success){
layer.closeAll();
layer.msg(rs.msg,function(){});
window.location.href = "/admin/";;
}else{
layer.msg(rs.msg,function(){});
}
},'json');
});
},
btn2: function(index, layero){
layer.closeAll();
},
});
});

复制代码

@bp.route('/entry/',methods=['GET','POST'])
@login_required
def entry():
error = None
if request.method == 'GET':
return render_template('admin/entry.html.j2')
else:
user = request.values.get('username')
online = request.values.get('online')
pwd = request.values.get('password')
logging.debug('ENTRY--username %s ' % user)
users = Users.query.filter_by(username=user).first()
if users == None:
errmsg = '无此用户'
logging.info(errmsg)
rs_data = {
'success':0,
'msg':errmsg,
'status':201
}
return json.dumps(rs_data)
if user != users.username or users.check_password(pwd) == False :
errmsg = "用户名或密码错！！"
rs_data = {
'success':0,
'msg':errmsg,
'status':201
}
return json.dumps(rs_data)
#return render_template('admin/entry.html.j2',message=error)
session[config.ADMIN_USER_ID] = users.uid
if online:
logging.debug('记住我设置')
session.permanent = True
bp.permanent_session_lifetime = timedelta(days=14)
logging.debug('entry main %s... %s' % (users.uid,users.username))
rs_data = {
'success':1,
'msg':'切换账户成功' + user,
'status':200
}
return json.dumps(rs_data)

复制代码