layui下拉框多级联动的实现

前端框架使用的是layui,大前提要注意一下:

直接上代码:
form.on('select(pcode)', function (data) {					
            var repirName = data.value;
            $.ajax({
                type: "post",
                data: {repirName: repirName},
                url: "/inputBill/getChildType",
                success: function (data) {
                    console.log(data);
                    var str = "<option value=''>---请选择---</option>";
                    for (var i = 0; i < data.length; i++) {
                        var json = data[i];
                        str += '<option value="' + json.repair_name + '">' + json.repair_name + '</option>';
                    }
                    $("#device_small_type").html(str);				//第二级select标签的ID
                    form.render('select');
                }
            });
        });

强调一下://pcode为多级联动(二级,三级…)上一级select标签的lay-filter 属性
然后通过Ajax的 方式获取的数据,在回调中又将数据铺回页面上。

如果下拉框还想实现搜索的功能,加上 lay-search="" 这个属性就好了

【不知道是什么原因,使用上述方法后,通过form表单提交取不到对应的selected 的值,后面就只能靠js了。小伙伴也要注意这个问题,路过的大神知道的评论指教一下哈】

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值