layui数据表格加入下拉框

<table id="demo" lay-filter="test"></table>

<script>
  layui.use(['table', 'jquery', 'form'], function () {
        var table = layui.table;
        var form = layui.form;
        var $ = layui.jquery;
        var tableObject;
        //第一个实例
        tableObject = table.render({
            elem: '#demo'
            , height: 500
            , url: 'http://localhost:8080/findAll' //数据接口
            //, page: true //开启分页
            , method: 'post'  //提交方式 get/post
            , toolbar: true    //开启表头工具栏
            , cols: [[ //表头
                {field: 'name', title: '名称',align:'center'}
                , {field: '', title: '号码',templet:function(d){
                        return '<select name="city" lay-verify="required">
' +
                            '        <option value=""></option>
' +
                            '        <option value="1001">1号</option>
' +
                            '        <option value="1000">2号</option>
' +
                         
                            '      </select>';
                    },align:'center'}
                , {field: 'dataDesc', title: '保存',templet:function (d) {
                    return '  <button type="button" class="layui-btn layui-btn-primary layui-btn-sm">保存</button>';

                    },align:'center'}

            ]]
            ,done: function (res, curr, count) {
                //数据渲染完的回调。
                //由于layui 设置了超出隐藏,所以这里改变下,以兼容操作按钮的下拉菜单
                $(".layui-table-body, .layui-table-box, .layui-table-cell").css('overflow', 'visible'); }


        });
    })
    <script>

由于layui自带的样式中定义的表格高度会自动隐藏下拉框内容,所以要加上,上面代码里已经加上了,加上下面这段代码问题解决

 ,done: function (res, curr, count) {
                //数据渲染完的回调。
                //由于layui 设置了超出隐藏,所以这里改变下,以兼容操作按钮的下拉菜单
                $(".layui-table-body, .layui-table-box, .layui-table-cell").css('overflow', 'visible'); }
原文地址:https://www.cnblogs.com/Im-Victor/p/14543353.html