用到的技术:Layui框架、TP5、Ajax
注意:该方法,需要composer安装拓展包,当然思路最重要
前端样式
前端关键代码
<input type="hidden" name="iccid_list" id="iccid_list" value="">
<div class="layui-form-item">
<div class="layui-input-block">
<div class="layui-btn">
<input type="file" disabled="disabled" name="file" id="upload">
</div>
<button type="button" lay-submit="do" class="layui-btn" id="expExcel"
name="exportExcel">
<i class="layui-icon"></i>下载示例表格
</button>
</div>
</div>
<div class="layui-footer" style="left: 0;">
<button class="layui-btn" lay-submit="" lay-filter="component-form-demo1">立即提交</button>
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
</div>
<input type="hidden" name="iccid_list" id="iccid_list" value="">
<script>
//指定允许上传的文件类型
upload.render({
elem: '#upload'
, url: '{:Url("uploadIccid")}'
, accept: 'file' //普通文件
, exts: 'xls|excel'
, done: function (res) {
if (res != '') {
//处理上传表格内的数据,添加到input的隐藏域中
$("#iccid_list").attr("value", res.map(Number));
layer.msg('上传成功');
}
}
});
//点击提交,将表单数据传到后台
form.on('submit(component-form-demo1)', function (data) {
$.ajax({
'url': '{:Url("index")}',
'data': JSON.stringify(data.field),
'success': function (data) {
if (data.code === 1) {
parent.layer.alert(data.msg, {
title: '成功'
});
} else {
parent.layer.alert(data.msg, {
title: '失败'
});
}
location.reload();
},
'dataType': 'json',//返回的格式
'type': 'post',//发送的格式
});
return false;
});
</script>
后端代码
该部分主要是处理表格内的数据,解析为想要的格式
//可以将下列代码,放到common中,便于多次调用
function importExecl($file = '', $sheet = 0)
{
$file = iconv('utf-8', 'gb2312', $file); //转码
if (empty($file) or !file_exists($file)) {
die('file not exists!');
}
$objRead = new PHPExcel_Reader_Excel2007(); //建立reader对象
if (!$objRead->canRead($file)) {
$objRead = new PHPExcel_Reader_Excel5();
if (!$objRead->canRead($file)) {
die('No Excel!');
}
}
$cellName = array('A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S',
'T', 'U', 'V', 'W', 'X', 'Y', 'Z', 'AA', 'AB', 'AC', 'AD', 'AE', 'AF', 'AG', 'AH', 'AI', 'AJ', 'AK', 'AL',
'AM', 'AN', 'AO', 'AP', 'AQ', 'AR', 'AS', 'AT', 'AU', 'AV', 'AW', 'AX', 'AY', 'AZ',);
$obj = $objRead->load($file); //建立excel对象
$currSheet = $obj->getSheet($sheet); //获取指定的sheet表
$columnH = $currSheet->getHighestColumn(); //取得最大的列号
$columnCnt = array_search($columnH, $cellName);
$rowCnt = $currSheet->getHighestRow(); //获取总行数
$data = array();
for ($_row = 1; $_row <= $rowCnt; ++$_row) { //读取内容
for ($_column = 0; $_column <= $columnCnt; ++$_column) {
$cellId = $cellName[$_column] . $_row;
$cellValue = $currSheet->getCell($cellId)->getValue();
//$cellValue = $currSheet->getCell($cellId)->getCalculatedValue(); #获取公式计算的值
if ($cellValue instanceof PHPExcel_RichText) { //富文本转换字符串
$cellValue = $cellValue->__toString();
}
$data[$_row][$cellName[$_column]] = $cellValue;
}
}
return $data;
}
该部分主要用来接受file文件,然后调用上面的方法,处理,返回想要的数据
/**
* 上传表格
*/
public function uploadIccid()
{
$file = $this -> request -> file('file');
if(empty($file)){
$this->error('上传文件内容为空,导入失败');
}
$file_check = $file->getInfo()['name'];//获取文件名称
$file_type = substr($file_check,strripos($file_check,".")+1);
if(!in_array($file_type,['xls','xlsx'])){
$this -> error('上传文件格式有误,只允许表格');
}
$file_base_path = $file->getPath();
$file_name = $file->getFilename();
$file_path = $file_base_path.DS.$file_name;
$excel = importExecl($file_path);
//删除单元格名称
$data = array_splice($excel,1);
$dataIccid = [];
$i= 0;
foreach ($data as $key=>$value){
$dataIccid[$i] = $value['A'];
$i +=1;
}
return $dataIccid;
}
效果
总结:
其实可以将该方法封装成一个共通方法,便于以后多次调用。
原理,就是前端传递表格文件,后端处理文件使之成为想要的数据,然后将数据传给前端,将数据塞到前端的隐藏域中,最后利用form表单或者ajax提交保存数据即可。