LayUI如何导入excel文件

layui导入excel文件的方法：首先在页面中引入【excel.js】文件；然后监听头工具栏的点击事件，代码为【title : '导入Excel',content : $("#ImportExcel")】。

layui导入excel文件的方法：

1、在页面中引入excel.js文件：

//引入excellayui.config({    base: 'layui_ext/',}).extend({    excel: 'excel',});

2、监听头工具栏的点击事件

// 监听头工具栏事件table.on('toolbar(terminalConfig)', function(obj) {    var layer = layui.layer;    // 添加终端    if(obj.event == 'import'){        layer.open({            type : 1,            shade : false,            area : [ '350px', '260px' ],            title : '导入Excel',            content : $("#ImportExcel"),            cancel : function() {                layer.close();            },            success : function(layero, index) {                ImportExcel();            },        });    }    //导入Excel结束});//监听头工具栏事件结束

3、ImportExcel()方法：

//导入方法function ImportExcel(){    var $ = layui.jquery    ,upload = layui.upload;    var uploadInst = upload.render({        elem: '#importExcel',        /*method: 'POST',*/        url: basePath + 'PowerUser/importPowerUserData.action',        accept: 'file', //普通文件        exts: 'xls|excel|xlsx', //导入表格        auto: false,  //选择文件后不自动上传        before: function (obj) {            layer.load(); //上传loading        },        choose: function (obj) {// 选择文件回调            var files = obj.pushFile();            var fileArr = Object.values(files);// 注意这里的数据需要是数组，所以需要转换一下            //console.debug(fileArr)            // 用完就清理掉，避免多次选中相同文件时出现问题            for (var index in files) {                if (files.hasOwnProperty(index)) {                    delete files[index];                }            }            uploadExcel(fileArr); // 如果只需要最新选择的文件，可以这样写： uploadExcel([files.pop()])        },        error : function(){            setTimeout(function () {                layer.msg("上传失败！", {                    icon : 1                });                //关闭所有弹出层                layer.closeAll(); //疯狂模式，关闭所有层            },1000);        }    });}

4、uploadExcel()方法：

function uploadExcel(files) {    try {        var excel = layui.excel;        excel.importExcel(files, {            // 读取数据的同时梳理数据            fields: {                'tId' : 'A',                'inport' : 'B',                'state' : 'C',                'householdNumber' : 'D',                'accountName' : 'E',                'phone' : 'F'            }        }, function (data) {            var arr = new Array();            for(i = 1; i < data[0].Sheet1.length; i++){                var tt = {                    cId : selectConcentrator,                    tId : data[0].Sheet1[i].tId,                    inport: data[0].Sheet1[i].inport,                    state: data[0].Sheet1[i].state,                    householdNumber: data[0].Sheet1[i].householdNumber,                    accountName: data[0].Sheet1[i].accountName,                    phone: data[0].Sheet1[i].phone,                };                arr.push(tt);            }                         $.ajax({                async: false,                url: basePath + 'PowerUser/importPowerUserData.action',                type: 'post',                dataType: "json",                contentType: "application/x-www-form-urlencoded",                data: {                    data : JSON.stringify(arr)                },                success: function (data) {                    if(data.success){                        layer.msg(data.message);                        setTimeout(function () {                            layer.closeAll(); //疯狂模式，关闭所有层                        },1000);                        //表格导入成功后，重载表格                        tableIns.reload('testTerminalConfigReload',{                            url : basePath + 'PowerUser/PowerUserDataTable.action',                            page : {                                limit : 10, // 初始 每页几条数据                                limits : [ 10, 20, 30 ]                                // 可以选择的 每页几条数据                            },                            where : {                                cId : selectConcentrator,                                tId : selectTerminal                            },                            parseData: function(res){ //res 即为原始返回的数据                                return {                                    "code": 0, //解析接口状态                                    "msg": res.message, //解析提示文本                                    "count": res.total, //解析数据长度                                    "data": res.data //解析数据列表                                };                            }                        }, 'data');                    } else {                        //表格导入失败后，重载文件上传                        layer.alert(data.error+"请重新上传",{icon : 2});                    }                },                error: function (msg) {                    layer.msg('请联系管理员!!!');                }            });        });    } catch (e) {        layer.alert(e.message);    }}