遇到的一些问题:
一、下拉框被遮住了:解决方法 请看步骤3
二、下拉框获取不到值:解决 请看步骤4
1、数据表格
table.render({
id: ‘terminalList‘,
elem: ‘#terminalList‘
, url: url
,toolbar: ‘#topToolbar‘
,done: setAutoWidth
, cols: [[
{checkbox: true, fixed: true}
, {field: ‘achievement_uuid‘, title: ‘id‘, width: ‘15%‘,hide:true}
,{field: ‘zizeng‘, width: ‘6%‘, title: ‘序号‘,fixed: ‘left‘,templet:‘#zizeng‘,align:‘center‘}
, {field: ‘id‘, title: ‘id‘, width: ‘15%‘,hide:true}
, {field: ‘eid‘, title: ‘id‘, width: ‘15%‘,hide:true}
, {field:‘employee_name‘, width: ‘10%‘, align: ‘center‘,title: ‘奖励员工姓名‘,edit: ‘text‘}
, {field: ‘duty_type‘, title: ‘职务级别‘, width: ‘7%‘,align:‘center‘,templet: ‘#selectGxmc‘}
, {field: ‘organization‘, title: ‘所在单位‘, width: ‘14.3%‘,align:‘center‘,edit: ‘text‘}
, {field: ‘post‘, title: ‘岗位名称‘, width: ‘15%‘,align:‘center‘,edit: ‘text‘}
, {field: ‘earnings_type‘, title: ‘奖励兑现类别‘, width: ‘14%‘,align:‘center‘,templet: ‘#selectEarnings‘}
, {field: ‘proportion‘, title: ‘个人奖励比列%‘, width: ‘9.5%‘,align:‘center‘,edit: ‘text‘}
, {field: ‘earnings_price‘, title: ‘个人奖励额度/元‘, width: ‘10%‘,align:‘center‘,templet: ‘#test888‘}
, {field: ‘remark‘, title: ‘备注‘, width: ‘11%‘,align:‘center‘,edit: ‘text‘}
]],
2、下拉框方法
无
正厅
副厅
正处
副处
正科
副科
3、下拉框样式
.layui-table-cell{
overflow: visible !important;
}
td .layui-form-select{
margin-top: -10px;
margin-left: -15px;
margin-right: -15px;
}
.layui-form-select dl{
z-index:9999;
}
.layui-table-cell{
overflow:visible;
}
.layui-table-box{
overflow:visible;
}
.layui-table-body{
overflow:visible;
}
.div-inline{ display:inline}
#fileName {
position: relative;
display: inline-block;
background: #D0EEFF;
border: 1px solid #99D3F5;
border-radius: 4px;
padding: 4px 12px;
overflow: hidden;
color: #1E88C7;
text-decoration: none;
text-indent: 0;
line-height: 20px;
}
#fileName input {
position: absolute;
font-size: 100px;
right: 0;
top: 0;
opacity: 0;
}
#fileName:hover {
background: #AADFFD;
border-color: #78C3F3;
color: #004974;
text-decoration: none;
}
4、回选下拉框选中的值
form.on(‘select(testSelect)‘, function (data) {
var elem = $(data.elem);
var trElem = elem.parents(‘tr‘);
var tableData = table.cache[‘terminalList‘];
// 更新到表格的缓存数据中,才能在获得选中行等等其他的方法中得到更新之后的值
tableData[trElem.data(‘index‘)][elem.attr(‘name‘)] = data.value;
// 其他的操作看需求 TODO
});
5、获取数据表格所有的值 ,只能获取到 数据表格单元中含有edit:text 的字段
var table_first = layui.table.cache["terminalList"];
6、获取数据单元中不可编辑的字段
for (var i=0 ; table_first.length > i ; i++) {
var id = table_first[i].id;
// 取出要获取的值
var val = $("#test99"+id).html();
// table创建earnings_price字段,然后存入值
table_first[i][‘earnings_price‘]=val; }
var list =JSON.stringify(table_first);
原文:https://www.cnblogs.com/alomsc/p/12573607.html