Layui
监听下拉
js
<select name="iscompleted" id="iscompleted" lay-filter="iscompleted">
<option selected="" value="请选择">请选择</option>
<option value="1">已完成</option>
<option value="2">未完成</option>
</select>
layui.form.on('select(iscompleted)', function(data){
_gd_common.getDmmx("gdfl",data.value,"z");
});给时间赋值
js
laydate.render({
elem: '#finishTime2',
//range: true,
});
<input type="text" name="finishTime" id="finishTime2" class="layui-input">
$("#finishTime2").val(finishTimeTemp);form表单赋值
js
//渲染
layui.form.render("select");
//赋值
parent_json = eval('('+objJson+')');
layui.form.val('issueForm', parent_json);
//使用场景
var selectstr = {};
selectstr.issuesType = '38000903';
layui.form.val('sendMeetingForm', selectstr);
layui.form.render("select");input不显示历史
html
<input type="text" name="meetingDate" id="meetingTime" class="layui-input" autocomplete="off">弹框使用
html
layer.open({
// type: 1,
// title: false,
title:"预约时间",
shadeClose: true,
content: '<input type="text" class="layui-input" id="yysj" name="yysj" placeholder="yyyy-MM-dd HH:mm:ss" autocomplete="off" >',
btn: ['确定', '取消'],
success: function(layero, index){
console.log(1111)
layui.laydate.render({
elem: '#yysj'
,type: 'datetime'
});
},
yes:function (index, layero){
console.log($("#yysj").val())
// layer.close(index);
},
btn2: function(index, layero){
layer.close(index);
}
});表格复选框全选
https://blog.csdn.net/chinmo/article/details/125330258
js
$("#checkall").click(function() {
$("input:checkbox").each(function() {
$(this).attr('checked','')
});
$(".layui-form-checkbox").each(function() {
$(this).addClass('layui-form-checked');
});
});
$("#checkoff").click(function() {
$("input:checkbox").each(function() {
$(this).removeAttr('checked');
});
$(".layui-form-checkbox").each(function() {
$(this).removeClass('layui-form-checked');
});动态添加表格
js
var tableIns = table.render({
elem: '#hylxrTable'
,data:[]
,page: true //开启分页
,cellMinWidth: 80
,cols: [[ //表头
{type:'numbers',title: '序号'}
,{type: 'checkbox'}
,{field: 'YHID',title: 'ID', hide:true}
,{field: 'XM', title: '姓名',align:'center',edit: 'text'}
,{field: 'BMMC', title: '部门',align:'center'}
,{field: 'BZ', title: '备注',align:'center',edit: 'text'}
// ,{field: 'CZ', title: '操作',align:'center',width:100}
]]
});
var oldData = table.cache['hylxrTable'];
var newRow = {YHID: '121', XM: null, BMMC: null, BZ: null};
oldData.unshift(newRow);
tableIns.reloadData({
data : oldData
});
//判断是否可编辑
layui.table.render({
elem: '#hylxrTable'
,data:layuidata
,page: true //开启分页
,cellMinWidth: 80
,editTrigger: 'dblclick'
,cols: [[ //表头
{type:'numbers',title: '序号'}
,{type: 'checkbox'}
,{field: 'YHID',title: 'ID', hide:true}
,{field: 'XM', title: '姓名',align:'center',edit: function (d) {if (d.YHZT == 'add') {return 'text';}}}
,{field: 'BMMC', title: '部门',align:'center',edit: function (d) {if (d.YHZT == 'add') {return 'text';}}}
,{field: 'BZ', title: '备注',align:'center',edit:'text'}
,{field: 'CZ', title: '操作',align:'center',width:100,toolbar: '#hyYhBar'}
]]
,done: function (res, curr, count) {
}
});表格操作使用
js
{field: 'cz',title: '操作', align:'center',toolbar:'#tab1tool'}
<script type="text/html" id="tab1tool">
{{# console.log(d)}}
{{# if(d.issueStage=='议题创建阶段' && d.issueStatus == '已起草'){ }}
<a lay-event="edit">修改</a>
<a lay-event="delete">删除</a>
{{# }else if(d.issueStage=='议题创建阶段' && d.issueStatus == '审批通过'){ }}
<a lay-event="shsq">上会申请</a>
<!-- <a lay-event="nullify">作废</a>-->
{{# } else if(d.issueStage=='议题上会阶段' && d.issueStatus == '审批通过'){}}
{{# } else if( d.issueStatus == '审批不通过'){ }}
<a lay-event="edit">修改</a>
<!-- <a lay-event="nullify">作废</a>-->
{{# } }}
<a lay-event="view">查看进度</a>
</script>html方式打开窗口
js
var html = ['<div class="layui-form" lay-filter="zutojyandtzForm" id="zutojyandtzForm">\n' +
'\n' +
' <div style="font-size: 20px;margin: 20px">\n' +
' 缺少' +msgtemp.substring(0,msgtemp.length-1)+'!\n勾选自动生成，或返回手动上传皆可。'+
' </div>\n' +
' <div class="layui-input-block" style="margin-left: 20px;">\n' +
' <input type="checkbox" name="hytz" value="hytz" title="会议通知" >\n' +
' <input type="checkbox" name="hyjy" value="hyjy" title="会议纪要" >\n' +
' </div>\n' +
'\n' +
'</div>'
].join("");
layer.open({
type: 1,
title: "系统提示",
area: ['400px', '280px'],
content: html,
btn: ['确定', '关闭'],
success: function (layero, index) {
layui.form.render();
},
yes: function (indexp, layero) {
var autoform = layui.form.val('zutojyandtzForm');
},
cancel: function () {
return false;
}
});layui的load使用
js
var hyloadIndex = layer.load(2);
layer.close(hyloadIndex);layui提示
js
var index = layer.msg('<span><i class="layui-icon layui-icon-loading layui-anim layui-anim-rotate layui-anim-loop" style="font-size: 30px;"></i></span><span style="margin-left: 10px;">提交成功，正在生成评价表，请稍后！</span>', {icon: -1,time:0,shade:0.3});
layer.close(index);一行显示连个按钮
html
<div class="layui-row">
<div class="layui-col-md10" style="width: calc(100% - 50px)">
<th:block th:include="common/title :: title2('我的合同')" />
</div>
<div class="layui-col-md2" style="width: 50px;">
<th:block th:include="common/title :: title2('我的合同')" />
</div>
</div>隐藏X
js
$('.layui-layer-setwin').hide();
点击行选中checkbox
js
table.on('row(ytXxTable)', function(obj){
var isXz = $(this).find("input:checkbox").is(':checked');
if(isXz){
obj.setRowChecked(false);
}else {
obj.setRowChecked(true);
}
});自动点击checkbox radio
js
function selectRadioByValue(value) {
var radio = $('input[name="spzt"][value="' + value + '"]');
if (radio.length) {
radio.prop('checked', true);
form.render();
radio.next('.layui-form-radio').trigger('click');
}
}
selectRadioByValue("03");错误总结
下面的问题需要从新加载下即可
页面加载完从新加载下即可 layui.table.reload('fileTable')