layui开源模块化前端 UI 框架使用技巧

1、点击数据表格添加或删除一行

数据表格

t2 = {
　　elem: '#test2',
　　data: tableData2,
　　page: false,
　　width: $(parent.window).width()-50,
　　cols: [[
　　　　{type:'checkbox',field:'id'},
　　　　{field:'cstMoldNo', title: '客户模号',edit:'text'},
　　　　{field:'cstProdName', title: '产品名称',edit:'text'},
　　　　{field:'material', title: '产品材料',edit:'text'},
　　　　{field:'firstTryDate', title: '验证日期',edit:'text'},
　　　　{field:'deliveryDate', title: '交货日期',edit:'text'},
　　　　{field:'unit', title: '单位',edit:'text'},
　　　　{field:'count', title: '数量',edit:'text'},
　　　　{field:'upTax', title: '含税单价',edit:'text'},
　　　　{field:'priceTax', title: '含税金额',edit:'text'},
　　　　{field:'remark', title: '备注',edit:'text'},
　　　　{fixed: 'right', title: '操作',width: '10%',align: 'center',toolbar: '#barDemo'}
　　]]
};

 

点击添加一行

document.getElementById('addsome2').addEventListener('click',function (data) {
    var oldData =  table.cache["test2"];
    var data1={};
    oldData.push(data1);
    table.reload('test2',{data : oldData});
});

点击删除一行

if(obj.event === "del"){
    layer.confirm("你确定要删除么？",{btn:['是的,我确定','我再想想']},
        function(){
            var oldData =  table.cache["test2"];
            oldData.splice(obj.tr.data('index'),1);
            layer.msg("删除成功",{time: 10},function(){
                    table.reload('test2',{data : oldData});
                }
            );
        }
    )
}