layui中请求后台数据动态创建下拉框

2019-07-05 18:24:24  卢浮宫  阅读量:111  版权声明:本文为站长原创文章,转载请写明出处


一、今天使用layui的时候需要根据后台动态创建下拉框,这里做下简单记录


二、首先吐槽一下layui中组件的使用方式:

    ①layui中分为layui和layer

    ②layer可以作为一个单独的组件进行使用

    ③切记如果你引入了layui那么一定不要在页面引入layer的相关资源

    ④layui中使用组件时要先引入(我感觉是超级XX的

    ⑤当你引入了某些组件后如果你的html是动态生成的,比如:

        <div v-if="showEdit && (dealType == 'add' || dealType == 'edit')">

        那么恭喜你,组件不会显示,你需要在引入后进行XX.render();操作


三、不想说了,直接上代码吧

    

layui.use(['laypage', 'layer','form','jquery'], function(){
        var laypage = layui.laypage,
            form = layui.form,
            layer = layui.layer,
            $=layui.$;
        //分页
        laypage.render({
            elem: 'xaPage'
            ,count: xa.postionList.length
            ,layout: ['count', 'prev', 'page', 'next', 'limit', 'skip']
            ,jump: function(obj){
                xa.pageCount = obj.limit;
                xa.getIndex++;
                xa.getPageData(obj.curr,obj.limit)
            }
        });
        //下拉框
        var url = "../../sys/dept/list";
        $.ajax({
            type: "get",
            url: url,
            data: {

            },
            dataType: 'json',
            contentType: "application/json; charset=utf-8",
            success: function (data) {
                for (var index = 0;index < data.length;index++){
                    var dataTmp = data[index];
                    $('#deptPanel').append(new Option(dataTmp.name,dataTmp.deptId));//往下拉菜单里添加元素
                }
                form.render();
            }
        });
    });

最新评论:
疯狂搞鬼 2019-07-06 17:42:33
尝试搞鬼 2019-07-06 17:42:22