Thinkphp5学习019-项目案例-登录帐户使用异步提交

Thinkphp5学习019-项目案例-登录帐户使用异步提交

一.修改登陆模板文件index.html

添加代码

          .on('success.form.bv',function(e){ //点击提交之后

                // Prevent form submission 防止表单提交

                e.preventDefault();

                // Get the form instance 获取form表单

                var $form = $(e.target);

                // Get the BootstrapValidatorinstance

                // var bv =$form.data('bootstrapValidator');

                // Use Ajax to submit form data提交至form标签中的action，result自定义

                $.post($form.attr('action'),$form.serialize(), function (result) {

                    if(!result.error){

                        alert(result.msg)

                        $form[0].reset();

                    }else{

                        alert(result.msg)

                       window.location.href="{:url('student/all')}"

                    }

                },'json');

           });

【知识点】

解析一.jquery传递ajax参数的方式$.post()

用法

 $.post(URL,data,callback);

.post() 方法通过 HTTPPOST 请求从服务器上请求数据。

参数说明：

URL：必选参数，用于服务器地址

data：可选，用于发送数据

callback：函数，用于数据返回处理

解析二.on('success.form.bv', function(e){success.form.bv要求form中有submit

解析三。$.post($form.attr('action'),$form.serialize(), function (result) {

$form.attr(‘action’)是submit所指的action,

$form.serialize是把form中的变量以数据的形式传递过控制器中input(‘post.’)

Function(result)是后台传回来的数据数组

二.修改控制器index.php中的代码

修改dologin（）代码为：

public function dologin()

    {

       $user = input('post.username');

       $pwd = input('post.password');

       $vcode = input('post.vcode');

       if (!captcha_check($vcode)) {

           //$this->error('验证码输入错误');

          return ['error'=>false,'msg'=>'验证码输入错误'];

       }

       $data = Db::name('users')->where('user', $user)->where('password',$pwd)->find();

       if (!$data) {

          //$this->error('用户名或密码错误');

           return ['error'=>false,'msg'=>'用户名或密码错误'];

       }

       Session::set('admin', $user);

        //$this->redirect('student/all');

        return ['error'=>true,'msg'=>'登陆成功'];

}

用return来返回数组一个是error一个msg

三.测试一下

1. 验证码错误情况

2.密码错误情况

3.正确登陆

确定后出现学生列表

.

====今天学习到此====