layui问题整理

 

1.多个checkbox同名时提交表单的处理

（1）提交表单的处理：

//配置
var configs = ";";
$("[name='config']").each(function(){
if($(this).prop("checked")){
configs += $(this).val() + ";";
}
});
if(configs != ';')
data.field["configs"] = configs; 

（2）表单加载时处理：
//设置配置选中
var configArr = result.configs.split(";")
for(var i in configArr){
$("[name='config']").each(function(){
if($(this).val() == configArr[i]){
$(this).prop("checked",true);

2.表格对应toolbar的button无法控制显示和隐藏，通过$(btn).show(),removeClass("layui-hide")都不起作用，非常奇怪！

【搞了半天，原因是button通过模板添加到表格上，每次reload表格会重新加载模板button，所以在reload表格之前对button控制都无效了，只能在reload之后处理。。。。】

 

(3) layui模板可以通过全局变量进行判断，contentTypeIds为全局变量

<script type="text/html" id="toolbar">
    <div class="layui-btn-container">        [#list contentTypeList as a]
            {{#  if(conentTypeIds.indexOf(',${a.id},') > -1){ }}
                <button class="layui-btn layui-bg-blue layui-btn-sm" lay-event="add" typeid="${a.id}" typename="${a.name}"><i class="layui-icon">&#xe654;</i>${a.name}</button>
            {{#  } }}
        [/#list]

 (4) 去掉默认的导出等按钮

<table id="list" class="layui-table" lay-filter="listTable"
                   lay-data="{height: 'full-110',page:true,limit:30, toolbar: '#toolbar',defaultToolbar:[]}">

（5）表格设定一些属性

参数名 可选值 备注
skin line （行边框风格）
row （列边框风格）
nob （无边框风格） 用于设定表格风格，若使用默认风格不设置该属性即可
even true/false 若不开启隔行背景，不设置该参数即可
size sm （小尺寸）
lg （大尺寸） 用于设定表格尺寸，若使用默认尺寸不设置该属性即可

（6）表单提交时layui通常写法如下

    如果在该function种，比如editor.getContent报错了，那么点击saveBtn这个按钮时表单会直接提交到当前页面，非常之奇怪，layui应当捕获一下异常，取消提交动作，搞得很奇怪的现象，其实看一下浏览器的console倒是也很快能定位问题。

form.on('submit(saveBtn)', function(data){
            data.field["id"] = currId;
            data.field["comment"] = editor.getContent();

            $.post("url", data.field,function(result) {
                ...
            });
            return false;
        });