博客

html代码：

 
               <div class="layui-col-xs12 layui-col-sm6 layui-col-md6">
                    <div class="layui-form-item">
                        <label class="layui-form-label required">主类型</label>
                        <div class="layui-input-block">
                            <select name="ParentIdSelect" id="ParentIdSelect" lay-verify="" lay-search="" lay-filter="ParentIdSelect"></select>
                        </div>
                    </div>
                </div>
                <div class="layui-col-xs12 layui-col-sm6 layui-col-md6">
                    <div class="layui-form-item">
                        <label class="layui-form-label required">子类型</label>
                        <div class="layui-input-block">
                            <select name="ChildIdSelect" id="ChildIdSelect"  lay-filter="ChildIdSelect" lay-verify="" lay-search=""></select>
                        </div>
                    </div>
                </div>

js 代码：

  var url = dinf.url + "ParentList";  //写自己的url
    var model = {
        "CompanyId": CId
    }; //需要传入的数据
    var redata = dinf.modelajaxfunPost(url, model); //自己的ajax
 
    //绑定
    if (redata) {
        $("#ParentIdSelect").empty();
        $('#ParentIdSelect').append("<option value=''></option>");
        $.each(redata.data, function (index, item) {
            $('#ParentIdSelect').append("<option value='" + item.Id + "'>" + $.trim(item.Name) + "</option>");
        });
    } else {
        $("#ParentIdSelect").empty();
    }
    layui.form.render("select");
 
 
    //监听父级select框
 
    form.on('select(ParentIdSelect)', function (data) {
        var url = dinf.url + "ChildList";
        var model = {};
        model["ParentId"] = data.value; //传入所需要的父级id以及自己接口需要传的数据
        model["CompanyId"] = CId;
       var  Table_data = dinf.modelajaxfunPost(url, model);
         if (Table_data) {
            $("#ChildIdSelect").empty();
            $('#ChildIdSelect').append("<option value=''></option>");
             $.each(Table_data.data, function (index, item) {
                 $('#ChildIdSelect').append("<option value='" + item.Name + "'>" + $.trim(item.Name) + "</option>");
            });
        } else {
            $("#ChildIdSelect").empty();
        }
         layui.form.render("select");
    });