layui多级分类_Layui二级联动和多级联动

最新推荐文章于 2023-07-12 19:00:24 发布

weixin_39951396

最新推荐文章于 2023-07-12 19:00:24 发布

阅读量788

点赞数

文章标签： layui多级分类

本文链接：https://blog.csdn.net/weixin_39951396/article/details/111898816

版权

本文介绍了如何使用layui框架实现多级分类的联动选择。通过AJAX获取数据，结合layui的element和form模块，动态加载公司和部门的下拉列表，并实现选择公司时部门列表的更新。

摘要由CSDN通过智能技术生成

layui.use(['element', 'form'], function () { var element = layui.element, form = layui.form; $(function () { $.ajax({ async: false, type: "POST", url: ctxPath + 'company/selectAll', success: function (result) { if (result.code == 0) { var list = result.data; var s = '请选择公司'; $.each(list, function (i, company) { console.log(company.name); s = s + '' + company.name + ''; }); $("#companyId").html(s); form.render('select'); } } }); }); form.on('select(companyId)', function (data) { var companyId = data.value; var s = '请选择部门'; if (companyId == '') { $("#departmentId").html(s); form.render('select'); } else { $.ajax({ async: false, type: "POST", //提交方式 url: ctxPath + 'department/selectAllDepartmentByComId',//路径 data: { companyId: companyId }, success: function (result) { if (result.code == 0) { var list = result.data; $.each(list, function (i, department) { s = s + '' + department.name + ''; }); $("#departmentId").html(s); form.render('select'); } } }); } });