提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  工具

当前栏目

Thinkphp6学习（8）layui-form异步提交和登陆后的页面跳转

学习异步 页面 提交 登陆 跳转 Form layui
2023-06-13 09:13:57 时间

知识：thinkphp6+layui-form异步提交和登陆后的页面跳转

问题：有一个界面有layui表单，后台是thinkphp6，thinkhphp我开启了多应用模式，我想要的效果：form异步提交，数据表查询是否存在，如果存在，判断不同的用户性质（管理员、在编、镇聘）不同的用户跳转到不同的页面主页

登陆界面、后台管理员、公办主页、镇聘主页分别如下

========================

登陆界面代码，放在index/view/index/testlogin.html文件中

========================

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>layui.form小例子</title>

<link rel="stylesheet" type="text/css" href="/static/layui/css/layui.css">

<script type="text/javascript" src="/static/layui/layui.js"></script>

</head>

<body style="background: #1E9FFF;">

<div class="layui-card" style="background:#f2f2f2;width: 400px;margin: 100px auto 0px;box-shadow: 10px 10px 30px #444;">

<div class="layui-card-header" style="text-align: center;"><h2>登陆界面</h2></div>

<div class="layui-card-body">

<form class="layui-form"> <!-- 提示：如果你不想用form，你可以换成div等任何一个普通元素 -->

<div class="layui-form-item">

<label class="layui-form-label">用户名</label>

<div class="layui-input-block">

<input type="text" name="username" placeholder="请输入用户名" autocomplete="off" class="layui-input">

</div>

</div>

<div class="layui-form-item">

<label class="layui-form-label">密码</label>

<div class="layui-input-block">

<input type="text" name="password" placeholder="请输入密码" autocomplete="off" class="layui-input">

</div>

</div>

<div class="layui-form-item">

<div class="layui-input-block">

<button class="layui-btn" lay-submit lay-filter="tt">立即提交</button>

<button type="reset" class="layui-btn layui-btn-primary">重置</button>

</div>

</div>

</form>

</div>

</div>

<script>

layui.use(['form', 'layer'], function(){

var form = layui.form

,layer = layui.layer

, = layui.;

form.on('submit(tt)', function(data){

console.log(data) //当前容器的全部表单字段，名值对形式：{name: value}

$.ajax({

url: '{:url("index/index/test")}',

type:'post',

data: data.field,

success: function(res){

//console.log('返回结果：', res)

if(res.code==1){

layer.msg(res.msg,{icon:1},function(){window.location.href=res.href})

}else{

layer.msg('登陆失败',{icon:2})

}

}

})

return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。

});

});

</script>

</body>

</html>

++==============

thinkphp6后台代码，放在index/controller/index.php中

++===============

public function testlogin()

{

return View::fetch();

}

public function test()

{

$data=input('post.');

$usermodel=new Users();

res=usermodel->where([

'user_name' =>$data['username'],

'user_password' =>$data['password']

])->find();

if($res){

switch ($res['user_status']) {

case '管理员':

$href='../../admin/admin/index';

break;

case '在编':

$href='../Gbteacher/index';

break;

default:

$href='../Zpteacher/index';

break;

}

return json(['code'=>1,'msg'=>'登陆成功','href'=>$href]);

}else{

return json(['code'=>0,'msg'=>'登陆失败']);

}

}

++==============

测试效果如下

++==============

相关文章