layui select监听选中的值 二级联动

layui select监听选中的值 二级联动

demo下载地址

html

<form class="layui-form" action="">
    <div class="layui-card-body ">
        <div class="layui-form-item platform2">
            <label class="layui-form-label">数组1</label>
            <div class="layui-input-block">
                <select name="platform" style="display: none;" lay-filter="xuanzhong">
                    <option value="">请选择</option>
                    <option value="37">数据1</option>
                    <option value="38">数据2</option>
                </select>
            </div>
        </div>
        <div class="layui-form-item platform2">
            <label class="layui-form-label">数组2</label>
            <div class="layui-input-block">
                <select name="platform1" style="display: none;" id="positionId">
                    <option value="">请选择</option>
                </select>
            </div>
        </div>
    </div>
</form>

js

layui.use(['form', 'layer', 'jquery'],
        function () {
            $ = layui.jquery;
            var form = layui.form,
                layer = layui.layer;

            form.on('select(xuanzhong)', function (data) {
                console.log(data.value);//判断单选框的选中值
                //发送ajax请求
                if (data.value == 37) {
                    var data1 = [{ id: 1, name: 123 }, { id: 2, name: 456 }, { id: 3, name: 789 }, { id: 4, name: 741 }]
                } else {
                    var data1 = [{ id: 1, name: 852 }, { id: 2, name: 753 }, { id: 3, name: 159 }, { id: 4, name: 000 }]
                }
                document.getElementById('positionId').innerHTML = '';
                $.each(data1, function (i, item) {
                    console.log(item.name);
                    $("#positionId").append($("<option value='" + item.id + "'>" + item.name + "</option>"));
                });
                form.render('select');

            });
        });

回显select

$("[name='cate_id']").find("[value='变量']").prop("selected", true);