layui table select 数据表格处理select或其他下拉组件不显示的问题

最新推荐文章于 2024-06-28 15:08:59 发布

煮吧姐

最新推荐文章于 2024-06-28 15:08:59 发布

阅读量2.6k

点赞数

分类专栏： JavaScript

本文链接：https://blog.csdn.net/sunwork888/article/details/104620256

版权

JavaScript 专栏收录该内容

14 篇文章 0 订阅

订阅专栏

方法一:
<style>
.layui-table-body, .layui-table-box, .layui-table-cell{
overflow: visible;
}

 /* 设置下拉框的高度与表格单元相同 */
         td .layui-table-cell .layui-form-select {
            margin-top: -10px;
            margin-left: -15px;
            margin-right: -15px;
        }
</style>

方法二:

  table.render({
                elem: '#TabLineDay'
                , cols: [[
                    {
                        field: 'VehiclePropertyName', title: '交通', width: 120, templet: function (d) {
                            var oSelect = '<select name="city" lay-filter="testSelect" lay-verify="required">';
                            @foreach (Property property in TypeList)
                            {
                                @:oSelect += "<option value='@(property.ID)'";
                                @:if (@(property.ID)== d.VehiclePropertyID) { oSelect += " selected " };
                                @:oSelect += ">@(property.Name)</option >";
                            }
                            oSelect += '</select>';
                            return oSelect;
                        }
                    }
                 
                ]]
                , data: oTabLineDayList
                , done: function (res, curr, count) {
                    //由于layui 设置了超出隐藏，所以这里改变下，以兼容操作按钮的下拉菜单
                    $(".layui-table-body, .layui-table-box, .layui-table-cell").css('overflow', 'visible');
                }
            });