fastadmin 联动

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
-----------------html-----------------data-source 二级联动 <br>
   <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Combo_id')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-coid" data-rule="required" data-source="zk/live/get_coid" class="form-control selectpage" name="row[coid]" data-primary-key="coid" type="text" value="">
        </div>
    </div>
 
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Dir_id')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-dir" data-rule="required" data-source="zk/live/get_dirlist" class="form-control selectpage" name="row[dir_id]" data-primary-key="coid" type="text" value="">
        </div>
    </div>
 
------------------------js------------------------------
        add: function () {
            $("#c-dir").data("params", function (obj) {
                return {coid: $("#c-coid").val()};
            });
            Controller.api.bindevent();
 
        },
----------------控制器----------------------------------
    public function get_coid()
    {
       $arr_l = [];  //数据库查值
        return json(['list' => $arr_l, 'total' => count($arr)]);
    }

　　

//data-source 下拉框联动

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
---------------------html------------
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Coid')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-lid" data-rule="required" data-source="chapter/cfatest/get_coid" class="form-control selectpage" name="row[coid]" data-primary-key="coid" type="text" value="">
        </div>
    </div>
 
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('阶段')}:</label>
        <div class="col-xs-12 col-sm-8">
 
            <select id="c-coid" data-rule="required" class="form-control" name="row[cid]">
                <!--<option>请选择</option>-->
            </select>
        </div>
    </div>
 
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('科目')}:</label>
        <div class="col-xs-12 col-sm-8">
 
            <select id="c-sid" data-rule="required" class="form-control" name="row[sid]">
                <!--<option>请选择</option>-->
            </select>
        </div>
    </div>
 
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('章节')}:</label>
        <div class="col-xs-12 col-sm-8">
 
            <select id="c-zid" data-rule="required" class="form-control" name="row[zid]">
                <!--<option>请选择</option>-->
            </select>
        </div>
    </div>
--------------------------js-------------------------------
        api: {
            bindevent: function () {
                Form.api.bindevent($("form[role=form]"));
                $(document).on('change', '#c-lid', function () {
                    //TODO data-source 三级联动
                    var cid =  $("input:hidden[name='row[coid]']").val();
                    console.log(cid)
                    console.log(12131213)
                    $.ajax({
                        url: 'chapter/cfatest/get_stage',
                        type: 'get',
                        data: {'cid': cid},
                        dataType:"json",
                        success: function (res) {
 
                            console.log(res);
                            let saveRes = '';
                            $("#c-coid").html('');
                            for (var i = 0; i < res.length; i++) {
                                //saveRes =  '<option value=' + res[i].cid + '>' + res[i].name + '</option>';
                                saveRes = res[i];
                                $("#c-coid").append(saveRes);
                            }
                            console.log(saveRes)
                        }
                    });
 
                });
                $(document).on('change', '#c-coid', function () {
                    var cid = $(this).find("option:selected").val();
                    var coid =  $("input:hidden[name='row[coid]']").val();
                    $.ajax({
                        url: 'chapter/cfatest/get_chapter',
                        type: 'get',
                        data: {'cid': cid,'coid':coid},
                        dataType:"json",
                        success: function (res) {
 
                            console.log(res);
                            let saveRes = '';
                            $("#c-sid").html('');
                            for (var i = 0; i < res.length; i++) {
                                //saveRes =  '<option value=' + res[i].cid + '>' + res[i].name + '</option>';
                                saveRes = res[i];
                                $("#c-sid").append(saveRes);
                            }
                            console.log(saveRes)
                        }
                    });
 
                });
 
                $(document).on('change', '#c-sid', function () {
                    var cid = $(this).find("option:selected").val();
                    var coid =  $("input:hidden[name='row[coid]']").val();
                    $.ajax({
                        url: 'chapter/cfatest/get_chapter1',
                        type: 'get',
                        data: {'cid': cid,'coid':coid},
                        dataType:"json",
                        success: function (res) {
 
                            console.log(res);
                            let saveRes = '';
                            $("#c-zid").html('');
                            for (var i = 0; i < res.length; i++) {
                                //saveRes =  '<option value=' + res[i].cid + '>' + res[i].name + '</option>';
                                saveRes = res[i];
                                $("#c-zid").append(saveRes);
                            }
                            console.log(saveRes)
                        }
                    });
 
                });
 
            }
        }
-------------------------------控制器------------------------------
    public function get_coid()
    {
         $arr = [];
        return json(['list' => $arr, 'total' => count($arr)]);
    }   
 
    public function get_stage()
    {
        $cid = $this->request->param("cid");
 
        $opt[] = '<option value="0">--请选择--</option>';
 
            $level = [];  //数据库查值
            foreach ($level as $k => $v) {
                $opt[] = "<option value='{$v['dir_id']}'>{$v['name']}</option>";
            }
            echo json_encode($opt, true);
            die;
        }
 
    }

　　

// data-source 搜索二级联动， 见开发示例

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
-------------html--------
<script id="customformtpl" type="text/html">
    <!--form表单必须添加form-commsearch这个类-->
    <form action="" class="form-commonsearch">
 
        <div class="row">
            <div class="form-group col-xs-12 col-sm-6 col-md-4 col-lg-3">
 
                <label class="control-label col-xs-4">分类</label>
                <div  data-toggle="cxselect" data-selects="group,admin,aaa,bbb">
 
                    <div class="col-xs-8">
                        <select class="group form-control" name="cid"
                                data-url="chapter/cfatest/get_cate_list?cid={$couid}">
                            <option value="{$cid}" selected=""></option>
                        </select>
                    </div>
                    <label class="control-label col-xs-4"></label>
                    <div class="col-xs-8">
                        <select class="admin form-control" name="cid1"
                                data-url="chapter/cfatest/get_cate_list"
                                data-query-name="cid">
                            <option value="{$cid1}" selected=""></option>
                        </select>
                    </div>
                    <label class="control-label col-xs-4"></label>
                    <div class="col-xs-8">
                        <select class="aaa form-control" name="cid2"
                                data-url="chapter/cfatest/get_cate_list"
                                data-query-name="cid">
                            <option value="{$cid2}" selected=""></option>
                        </select>
                    </div>
                    <label class="control-label col-xs-4"></label>
                    <div class="col-xs-8">
                        <select class="bbb form-control" name="cid3"
                                data-url="chapter/cfatest/get_cate_list"
                                data-query-name="cid">
                            <option value="{$cid3}" selected=""></option>
                        </select>
                    </div>
                    <input type="hidden" class="operate" data-name="cid" value="="/>
                    <input type="hidden" class="operate" data-name="cid1" value="="/>
                    <input type="hidden" class="operate" data-name="cid2" value="="/>
                    <input type="hidden" class="operate" data-name="cid3" value="="/>
                </div>
 
            </div>
 
 
 
            <div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
                <div class="col-sm-8 col-xs-offset-4">
                    <input type="submit" class="btn btn-success" value="提交"/>
                    <input type="reset" class="btn btn-default" value="重置"/>
                </div>
            </div>
        </div>
 
    </form>
</script>
 
---------------js--------------------------
                //TODO data-source 搜索二级联动
                searchFormVisible: true,
                searchFormTemplate: 'customformtpl',

　　

//三级联动

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<div class="form-group">
    <label class="control-label col-xs-12 col-sm-2">{:__('Coid')}:</label>
    <div class="col-xs-12 col-sm-8">
        <div class="form-inline" data-toggle="cxselect" data-selects="first,second,three">
            <select class="first form-control" name="pid1" data-url="ajax/get_cpa_cate?&pid=0">
         
            </select>
            <select class="second form-control" name="pid2" data-url="ajax/get_cpa_cate" data-query-name="pid">
            
            </select>
            <select class="three form-control" name="pid3" data-url="ajax/get_cpa_cate" data-query-name="pid">
        
            </select>
        </div>
    </div>
</div>

　　

//搜索追加data-source

?
1
2
3
4
5
6
7
table.on('post-common-search.bs.table', function (event, table) {
    var form = $("form", table.$commonsearch);
    //TODO data-source 搜索增加
    $("input[name='coid_name']", form).addClass("selectpage").data("source", "def/plan/get_cod/type/1").data("primaryKey", "coid").data("field", "name").data("orderBy", "sort desc").data("pageSize",10).data("pagination",'true')
    Form.events.cxselect(form);
    Form.events.selectpage(form);
});

　　

//搜索三级联动

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<script id="sourcetpl" type="text/html">
        <div class="">
            <div class="" data-toggle="cxselect" data-selects="first,second,three,dot">
                <select class="first form-control " name="did" data-url="test/cjzjtopic/topicCategory?pid=0">
                </select>
                <br>
                <!--<input type="hidden" class="operate" data-name="did" value="=" />-->
                <select class="second form-control " id="" name="zid" data-url="test/cjzjtopic/topicCategory" data-query-name="pid">
                </select>
                <br>
                <!--<input type="hidden" class="operate" data-name="fid" value="=" />-->
                <select class="three form-control" name="fid" data-url="test/cjzjtopic/topicCategory" data-query-name="pid">
                </select>
                <input type="hidden" class="operate" data-name="fid" value="=" />
 
            </div>
        </div>
</script>
 
------------------------------js---------------------------------------
                        {field: 'cpa.fid', title: __('层级'), searchList: function (column) {
                                return Template('sourcetpl', {});
                            },
                            visible: false
                        },

　　

posted @   叫我亚庆  阅读(452)  评论(0)  编辑  收藏  举报
相关博文：
·  fastadmin 选项卡默认选中
·  fastadmin 编辑后不刷新页面
·  fastadmin 的多表关联查询
·  fastadmin关联表，列表下拉查询搜索
·  MVC单表二级联动
阅读排行：
· 地球OL攻略 —— 某应届生求职总结
· 周边上新：园子的第一款马克杯温暖上架
· Open-Sora 2.0 重磅开源！
· 提示词工程——AI应用必不可少的技术
· .NET周刊【3月第1期 2025-03-02】
点击右上角即可分享
微信分享提示
AI IDE Trae