解决layui数据表格中嵌套下拉框显示问题

在layui数据表格中嵌套下拉框时，下拉框不能正常弹出，仔细观察发现，点击下拉框时会有一个短暂的弹出动画，马上又消失了，遂猜想，大概是显示的问题，可能是被覆盖了，那么解决覆盖就可以了。

如图，

下拉框已经弹出，只是没有正常显示

解决方法非常简单，只需在table渲染方法中添加如下代码即可，

done: function (res, curr, count) {$(".layui-table-body, .layui-table-box, .layui-table-cell").css('overflow', 'visible');}

table渲染代码

table.render({ //其它参数在此省略height: 'full-50',done: function (res, curr, count) {$(".layui-table-body, .layui-table-box, .layui-table-cell").css('overflow','visible');}
});

因为layui的样式冲突导致表格显示在下拉框的上方，所以你需要(为select标签)设置样式使得select标签显示在上层。

附：

thead中的填写

tbody的tr内容，是一个完整的下拉框

解决layui数据表格中嵌套下拉框显示问题相关推荐

layui 数据表格下拉框_LayUi数据表格中嵌套下拉框
layui嵌套下拉框实用方法(附效果图) 在做项目时遇到一个问题,在layui 的数据表格table里面如何做一个下拉框呢?效果图如下: 这样的效果想必是最理想的了思路分析: 我们可以通过layui ...
layui 数据表格下拉框_layui-table-column-select（layui数据表格可搜索下拉框select）
layui-table-column-select 在layui table的基础上对表格列进行扩展:点击单元格显示可搜索下拉列表. 码云地址:https://gitee.com/kkk12/layu ...
SpreadJS表格中关于下拉框new GC.Spread.Sheets.CellTypes.ComboBox()的设置和使用
SpreadJS表格中关于下拉框的设置和使用 Spreadjs使我们经常用到的一种表格插件,下面是自己使用中的一点心得,希望对大家有帮助,废话不所说,下面进入正题: 1.npm下载 @grapecit ...
LayUi数据表格数据太多导致下拉框卡顿问题
LayUi数据表格数据太多导致下拉框卡顿问题 layui数据表格(详见官网) 根据官网示例做出数据表格示例根据官网表格展示在layui官网数据表格示例中 https://www.layui.c ...
layui数据表格中导出所有数据的简易解决办法
layui数据表格中导出所有数据的简易解决办法官方文档的困惑解决办法官方文档的困惑首先要说明的是:layui在 table 的工具栏内置了数据导出按钮,如果你是用它内置的导出按钮来导出数据,是 ...
layui静态表格设置滚动条_解决layui数据表格table的横向滚动条显示问题
解决layui数据表格table的横向滚动条显示问题加上这段样式代码就可以解决了: body{overflow-y: scroll;} /* 禁止刷新后出现横向滚动条 */ ps:这个问题fly社区 ...
layui数据表格中包含图片的处理方式
layui数据表格中包含图片时,图片可能显示不全. 搜索后网上的解决方法: <style>.layui-table-cell {height: 100%;max-width: 100%;} ...
在layui数据表格中修改数据
一.修改layui表格中的数: 1.layui表格中开启输入框:edit:'text'; //渲染表格组件tableInsT = table.render({elem: '#tesc',url: '$ ...
layui数据表格中加入二维码
最近在做一个后端项目时,需要在表格中展示二维码,但是在layui表格渲染时无法获取元素id,下面就将我出现的问题记录下,并提供解决方案供大家查看. jq插件qrcode引入和下载 qrcode其实是通 ...

解决layui数据表格中嵌套下拉框显示问题

解决layui数据表格中嵌套下拉框显示问题相关推荐

最新文章

热门文章