【备忘】fastadmin下拉联动效果实现

发布时间:2023年12月27日

文章背景

为什么要写这个,因为它耗费了我2个小时的精力,差点无法准时下班!得记下来。

经历

甲方要求加个下拉联动的效果,这不过分,我开始在fastadmin上找文档,看下拉联动怎么做的,找了十几分钟,用文档提供的方法去尝试,都以失败告终,我只能说fastadmin官方的文档写得真的“精简”。

再次吐槽一下,fastadmin框架不适合新手开发者!!!

解决思路

  1. 获取第一个下拉的值
  2. Ajax异步去后台查询这个值的下属数据(关联数据)
  3. 设置第2个下拉框(input class=SelectPage的插件)的数据集
  4. 刷新SelectPage第2个插件

思路很简单,实操不一定,所有技术都是熟悉之后才觉得简单!

代码解析

//代码地址参考:D:\xxx\projects\performance\public\assets\js\backend\fundfileamount.js
//用fastadmin的都看得懂这个地址


//这里只剪切关键部分代码
add: function () { //此行对应的是我的新增界面,其它界面道理一样

    //这里是监控第1个下拉变动事件
    $("#c-users_id").data("eSelect", function(){

        //监控到的后续操作
        let users_id = $("#c-users_id").val();

        //异步查询第2个下拉的数据集
        $.post('Fundfileamount/getDepartment',{users_id:users_id},function (res) {
            //设置SelectPage数据
            $('#c-responsibledepartment_id').selectPageData(res);//这是第2个下拉
            //刷新SelectPage
            $('#c-responsibledepartment_id').selectPageRefresh();
        },'json');
    });

    //这里必须在最后,否则无效!!!
    Controller.api.bindevent();
},

后台代码


    /**
     * desc:查询第2个下拉框的数据集
     */
    function getDepartment(){
        $user_id = input('users_id');
        $list = Db::table(fa_responsibledepartment)
            ->where('users_id',$user_id)
            ->select();
        return json($list);//这里必须返回json数据
    }

最后还是感谢fastadmin提供的框架,优点是加速了开发进程,但是缺点也很明显,出的问题也能消耗非常多的时间,这样一来,优势并不明显。

END

文章来源:https://blog.csdn.net/qq_15941409/article/details/135252177
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。