layui二级联动

html代码

js代码

formSelects.on('animalType', function(id, vals, val, isAdd, isDisabled){
    $.ajax({
        url:setter.BASE_SERVER + "demo/list",
        //data 查询条件,根据动物类型查询动物名称
        data:{
            "animalType":val.type,
            "status":"1"
        },
        success:function(data){
            var data = data.res_data;
            var selectData = [];
            //拼写数据结构
            for (var i = 0 ; i < data.length ; i ++){
                var eachData = {name:data[i].animalName,value:data[i].id}
                selectData.push(eachData);
                //selectData的数据结构
                //[
                //    {"name": "燕子", "value": 1},
                //    {"name": "麻雀", "value": 2},
                //    {"name": "老鹰", "value": 3},
                //    {"name": "白鹤", "value": 4},
                //]
            }

            //local模式
            formSelects.data('animalName', 'local', {
                arr: selectData
            });
        }
    });
});

PS:在网上找了好多layui的级联demo,每个是都不太符合我的需求,最后根据文档自己写了一个。

你可能感兴趣的:(前端,layui,layui,js,前端,二级联动)