9 分类功能的添加和删除功能的实现

9 分类功能的添加和删除功能的实现

斤阶河悄晶蓝泼适耙火功啦碳


复制x-admin里面的admin-add.html到视图目录并重命名为cateadd.html

9 分类功能的添加和删除功能的实现第1张

控制器里面创建cateAdd()

9 分类功能的添加和删除功能的实现第2张

    //渲染添加模板
    public function cateAdd()
    {
        //添加操作不需要查询直接渲染模板即可
        //渲染模板
        return $this->view->fetch();
    }

将url连接到菜单

9 分类功能的添加和删除功能的实现第3张

点击添加

9 分类功能的添加和删除功能的实现第4张

错误原因,需将cateadd.html改为cate_add.html  因为tp会将驼峰命名的cateAdd()方法渲染的模板指向cate_add.html

修正:

9 分类功能的添加和删除功能的实现第5张

点击添加

9 分类功能的添加和删除功能的实现第6张


完善cate_add.html

{include file="common@header"}
    <div class="x-body">
        <form class="layui-form">
          <div class="layui-form-item">
              <label for="cate_name" class="layui-form-label">
                  分类名称
              </label>
              <div class="layui-input-inline">
                  <input type="text" id="cate_name" name="cate_name"
                  autocomplete="off" class="layui-input">
              </div>
          </div>
          <div class="layui-form-item">
              <label for="cate_order" class="layui-form-label">
                 分类排序
              </label>
              <div class="layui-input-inline">
                  <input type="text" id="cate_order" name="cate_order"
                  autocomplete="off" class="layui-input">
              </div>
          </div>
          <div class="layui-form-item">
              <label for="L_email" class="layui-form-label">
                  分类类型
              </label>
              <div class="layui-input-inline">
                <select name="cate_type" lay-verify="" id="cate_type">
                    <option value="1">列表页</option>
                    <option value="0">单页面</option>
                  </select>     
              </div>
          </div>
          <div class="layui-form-item">
              <label for="L_repass" class="layui-form-label">
              </label>
              <button  class="layui-btn" lay-filter="add" lay-submit="">
                  保存
              </button>
          </div>
      </form>
    </div>
    <script>
        layui.use(['form','layer'], function(){
            $ = layui.jquery;
          var form = layui.form
          ,layer = layui.layer;
        

          //监听提交
          form.on('submit(add)', function(data){
            console.log(data);
            //发异步,把数据提交给php
            $.post("{:url('doAdd')}",{
               'cate_name':$('#cate_name').val(), 
               'cate_order':$('#cate_order').val(), 
               'cate_type':$('#cate_type').val()
            },function(data){

            })
            layer.alert("增加成功", {icon: 6},function () {
                // 获得frame索引
                var index = parent.layer.getFrameIndex(window.name);
                //关闭当前frame
                parent.layer.close(index);
            });
            return false;
          });
          
          
        });
    </script>
  </body>

</html>

创建doAdd()方法

9 分类功能的添加和删除功能的实现第2张

//处理添加分类操作
    public function doAdd()
    {
        dump($this->request->param('cate_name'));
    }

添加并保存,提交数据测试成功

9 分类功能的添加和删除功能的实现第8张


完善doAdd()

<?php
namespace app\admin\controller;

//引入公共控制器
use app\common\controller\Base;
//引入模板
use app\common\model\Category as CateModel;

class Category extends Base
{
    public function index()
    {
        //显示分类表中的所有数据
        // 1.获取分页信息
        //  代码解释:all()查询分页表中的所有数据   按照id 升序排列

        $cates = CateModel::all(function($query){
            $query->order('cate_id','asc');
        });
        // 2.模板赋值
        $this->view->cates=$cates;

        // 3.渲染模板
        return $this->view->fetch();
    }

    //编辑分类信息
    public function  edit()
    {
        //获取要修改的分类id: cateId
        //这里直接使用系统控制器的request函数  不需要再引入request对象
        $cateId=$this->request->param('cateid');
        //根据当前分类id,获取对应的分类名称,返回的是数组
        $cate=CateModel::get($cateId);
        //模板赋值
        $this->view->assign('cate',$cate);
        //模板赋值的另一种写法  通过魔术方法set()实现
        // $this->view->cate=$cate;
        //渲染模板
        return $this->view->fetch();

    }

    //处理编辑操作
    public function  doEdit()
    {
        //根据分类id查询分类模型,并返回分类模板的实例对象
        $cate=CateModel::get($this->request->param('cate_id'));

        ////直接更新分类实例的对应字段信息:以对象属性方式
        $cate->cate_name=$this->request->param('cate_name');
        $cate->cate_order=$this->request->param('cate_order');
        $cate->cate_type=$this->request->param('cate_type');

        //更新模型并判断是否成功?
        if($cate->save())
        {
            //可以返回状态0/1之间切换来测试前端的提示信息
            return ['status'=>1,'msg'=>'更新成功'];
        }
        return ['status'=>0,'msg'=>'更新失败'];

    }
    
    //渲染添加模板
    public function cateAdd()
    {
        //添加操作不需要查询直接渲染模板即可
        //渲染模板
        return $this->view->fetch();
    }

    //处理添加分类操作
    public function doAdd()
    {
        // 创建模型对象
        //模型与表对应
        $cate = new CateModel();

        //通过魔术方法给模型对象赋值
        $cate->cate_name=$this->request->param('cate_name');
        $cate->cate_order=$this->request->param('cate_order');
        $cate->cate_type=$this->request->param('cate_type');

        //执行操作  成功返回受影响的行数
        if($cate->save())
        {
            //将数据返回给前端  默认为json   数据默认返回格式可以在项目的配置文件的config/app.php中查看
            return ['status'=>1,'msg'=>'添加成功'];
        }
    }

    
}

cate_add.html  完善回调函数

{include file="common@header"}
    <div class="x-body">
        <form class="layui-form">
          <div class="layui-form-item">
              <label for="cate_name" class="layui-form-label">
                  分类名称
              </label>
              <div class="layui-input-inline">
                  <input type="text" id="cate_name" name="cate_name"
                  autocomplete="off" class="layui-input">
              </div>
          </div>
          <div class="layui-form-item">
              <label for="cate_order" class="layui-form-label">
                 分类排序
              </label>
              <div class="layui-input-inline">
                  <input type="text" id="cate_order" name="cate_order"
                  autocomplete="off" class="layui-input">
              </div>
          </div>
          <div class="layui-form-item">
              <label for="L_email" class="layui-form-label">
                  分类类型
              </label>
              <div class="layui-input-inline">
                <select name="cate_type" lay-verify="" id="cate_type">
                    <option value="1">列表页</option>
                    <option value="0">单页面</option>
                  </select>     
              </div>
          </div>
          <div class="layui-form-item">
              <label for="L_repass" class="layui-form-label">
              </label>
              <button  class="layui-btn" lay-filter="add" lay-submit="">
                  保存
              </button>
          </div>
      </form>
    </div>
    <script>
        layui.use(['form','layer'], function(){
            $ = layui.jquery;
          var form = layui.form
          ,layer = layui.layer;
        

          //监听提交
          form.on('submit(add)', function(data){
            console.log(data);
            //发异步,把数据提交给php
            $.post("{:url('doAdd')}",{
               'cate_name':$('#cate_name').val(), 
               'cate_order':$('#cate_order').val(), 
               'cate_type':$('#cate_type').val()
            },function(data){
                if(data.status==1)
                {
                        layer.alert(data.msg, {icon: 6},function () {
                        // 获得frame索引
                        var index = parent.layer.getFrameIndex(window.name);
                        //关闭当前frame
                        parent.layer.close(index);
                    });
                }
                else
                {
                    layer.alert(data.msg, {icon: 6},function () {
                        // 获得frame索引
                        var index = parent.layer.getFrameIndex(window.name);
                        //关闭当前frame
                        parent.layer.close(index);
                    });
                }
            })
            
            return false;
          });
          
          
        });
    </script>
  </body>

</html>

添加栏目,添加成功!

9 分类功能的添加和删除功能的实现第9张

9 分类功能的添加和删除功能的实现第10张


轮吝佬北布蛊绞袄芭始恳丰讳