layui select下拉框联动

背景:涉及到 省市县获取的项目必有下拉框三级联动,每次都需要百度查询,或者去翻原来的项目,着实不方便。因此,为了自己对三级联动的印象加深,同时也帮助第一次接触下拉框三级联动的小伙伴快速上道,总结一下该组件与大家分享。如有不足之处欢迎一起探讨!

做的比较简单,先从后台直接把第一级菜单输出,然后点击二级菜单的时候再动态展示

请选择 {volist name="list" id="vo"} {$vo.cate_name} {/volist}

form.on(‘select(one_cate)’, function(data){
//data.value 得到被选中的值
var url = ‘/admin/category/selec/’ + data.value;
$.get(url,function(data){
$("#two_cate").empty();
$("#two_cate").append(new Option(“请选择分类”,""));
$.each(data,function(index,item){
$("#two_cate").append(new Option(item,index));
console.log(index,item);
});
layui.form.render(“select”);
});

    });

重点就两个

1.$("#two_cate").append(new Option(item,index));将遍历的数据插入到select中,比原来的拼接字符串省事。

2.layui.form.render(“select”);重载select模块,否则不会展示。

  • 1
    点赞
  • 1
    收藏
  • 打赏
    打赏
  • 0
    评论
©️2022 CSDN 皮肤主题:点我我会动 设计师:我叫白小胖 返回首页
评论

打赏作者

怡暘

你的鼓励将是我创作的最大动力

¥2 ¥4 ¥6 ¥10 ¥20
输入1-500的整数
余额支付 (余额:-- )
扫码支付
扫码支付:¥2
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值