layui使用某些注意点

1.搜索注意

1.1存在多个搜索同一个table的时候因为搜索条件的不同table执行relode的方法时，之前搜索的参数如果不清除，而下一个搜索面板没有此参数时，搜索参数会携带上一次的条件

解决方案：

.注意搜索时清空搜索条件且，要重置页数

this.where = {};

  form.on('submit(btn_Search)', function (data) {
            this.where = {};
            searchType = 1;
            var field = data.field;
            //去除前后的空格
            $.each(field, function (i) {
                field[i] = $.trim(field[i]);
            });
            ////执行重载
            table.reload('tableList', {
                where: field
                , page: {
                    curr: 1 //重新从第 1 页开始
                }
            });
            return false;
        });

 

2.监听toolbar

toolbar使用方法

toolbar写法

 

 //监听toolbar
        table.on('toolbar(tableList)', function (obj) {
            switch (obj.event) {
                case 'importCase':
                    //操作方法
                    break;
            };
        });

 3.table单击双击事件

//监听行单击事件（双击事件为：rowDouble,单击row）  
table.on('rowDouble(tableList)', function (obj) {
            var data = obj.data;
            //标注选中样式
            //obj.tr.addClass('layui-table-click').siblings().removeClass('layui-table-click');     
        });

4.表单提交（搜索或保存）

 //监听搜索
        form.on('submit(btn_Search)', function (data) {
            searchType = 1;
            var field = data.field;
            //去除前后的空格
            $.each(field, function (i) {
                field[i] = $.trim(field[i]);
            });
            ////执行重载
            table.reload('tableList', {
                where: field
                , page: {
                    curr: 1 //重新从第 1 页开始
                }
            });
            return false;
        });

5.时间选择器在谷歌空间过小时闪退问题

 laydate.render({
            elem: '#EntrustedCaseDate' //指定元素,format: 'yyyy年MM月dd日'
            , trigger: 'click' //解决谷歌空间小闪退问题
            , done: function (value, date) {
            }
        });

 6.checkbox 多选编辑问题

<div class="layui-input-block">
                <input id="A" type="checkbox" lay-skin="primary" name="CustomerGroupCode" value="A" title="A">
                <input id="B" type="checkbox" lay-skin="primary" name="CustomerGroupCode" value="B" title="B">
                <input id="C" type="checkbox" lay-skin="primary" name="CustomerGroupCode" value="C" title="C">
                <input id="D" type="checkbox" lay-skin="primary" name="CustomerGroupCode" value="D" title="D">
                <input id="E" type="checkbox" lay-skin="primary" name="CustomerGroupCode" value="E" title="E">
                <input id="F" type="checkbox" lay-skin="primary" name="CustomerGroupCode" value="F" title="F">
</div>

 var CustomerGroupCode = data.CustomerGroupCodes.split(",");
   for (var i = 0; i < CustomerGroupCode.length; i++) {
     $("input[name='CustomerGroupCode'][value='" + CustomerGroupCode[i] + "']").attr("checked", true);
    }

form.render();//注意最后要进行渲染

 7.table渲染本地数据时只显示10条问题

table.reload('tableList', {
              data: data,
              limit: data.length//设置其数量
              , done: function (res, curr, count) {
              layer.close(ii);
              }
             });