layui-switch动态改变状态

现在位置：首页 > 编程语言 > PHP > layui-switch动态改变状态

龙行 PHP 2018-10-12 605 0评论本文已被百度收录点击查看详情

第一部，官网下载layui包，推荐git（传送门），怎么引入项目就不说了进入主题

环境是php+mysql+js

html页面部分

<form class="layui-form" style="height: 30px;float: left">
   <div class="layui-form-item">
       <div class="layui-input-block" style="">
            <input type="checkbox" lay-skin="switch" {$vo.status? "checked=''": ""} lay-filter="switch" data-url="{:url('game_list/changeShow',array('id'=>$vo['id']))}" lay-text="on|off">
       </div>
   </div>
</form>

js部分：

//添加switch监听
layui.use('form', function(){
        var form = layui.form;
        form.on('switch(switch)', function(data) {
            var url = $(this).data('url');
            var status = data.elem.checked;//开关是否开启，true或者false
            //后台我需要的是0或1，所以预先在js中处理change的值
            if(status) {
                status = 1;
            } else {
                status = 0;
            }
            $.post(url, {status: status}, function(res) {
                if(res.code) {
                    layer.msg(res.msg);
                }
            });
        });
    });

//更改数据库status状态
 public function changeShow()
    {
        $GameList = new GModel();
        if ($this->request->isPost()) {
            $data['id'] = $this->request->param('id');
            $data['status'] = $this->request->param('status');

            $data = $GameList ->allowField(true) ->update($data);
            if ($data['status']==1) {
                $msg = '游戏开启成功';
                return json(['code'=>1,'msg'=>$msg]);
            }elseif($data['status']==0){
                $msg = '游戏关闭成功';
                return json(['code'=>1,'msg'=>$msg]);
            }
        }else{
            $res['code'] = 0;
            $res['msg'] = '这是个意外！';
            return $res;
        }
    }

好了就这些// 主要是页面部分php没看头，会一点都会update

评论一下分享本文赞助站长