java实现Excel导入功能(前端+后台)

本文详细介绍了如何使用Java实现Excel导入功能,包括前端HTML选择文件,通过AJAX请求发送到后台,后台使用Controller和Service进行文件内容解析,重点是ImportExcel内容格式与数据库模型的映射,以及解析完成后如何更新页面显示。注意使用easypoi和apache.poi库时版本需一致。
摘要由CSDN通过智能技术生成

java:导入功能的实现(前端+后台)

前端html代码

<form id="import-form" lay-filter="import-form" class="layui-form model-form" method="post" enctype="multipart/form-data">
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label" style="width: 120px;">请选择上传文件:</label>
            <div class="layui-input-inline">
                <input type="file" name="file" id="file" class="layui-input"/>
            </div>
        </div>

    </div>
    <div class="layui-form-item model-form-footer">
        <button class="layui-btn layui-btn-primary" ew-event="closeDialog" type="button">取消</button>
        <button class="layui-btn" id="import-form-submit"  type="button" onclick="importSubmit()">确定</button>
    </div>
</form>

选择文件后ajax请求后台读取文件内容

  function importSubmit() {
    var config = layui.config;
    //请求的数据是FormData类型
    var formData = new FormData();
    //获取上传的文件
    formData.append("file",$("#file")[0].files[0]);
    //url为文件读取的后台controller请求路径
    var url = '###';
    //ajax提交请求,注意data、contentType、processData和dataType的设置
    $.ajax({
        type: "POST",
        url: url,
        data: formData,
        contentType: false,
        processData:false,
        dataType: "json",
        success: function(resp_data) {
            if (resp_data.resp_code==0){
                //js封装了admin对象
                var admin = layui.admin;
                //admin对象封装了缓存和弹窗方法
                admin.putTempData("importData",resp_data.data
你可以使用Apache POI库来读取Excel文件,Spring Boot来处理HTTP请求和响应,和AJAX来发送异步请求从前端上传Excel文件。以下是一个基本的实现步骤: 1.添加Apache POI库的依赖到你的pom.xml文件中: ``` <dependency> <groupId>org.apache.poi</groupId> <artifactId>poi</artifactId> <version>4.1.2</version> </dependency> ``` 2.创建一个`@RestController`类来处理HTTP请求和响应: ``` @RestController public class ExcelController { @PostMapping("/upload") public String uploadFile(@RequestParam("file") MultipartFile file) { // 处理上传的Excel文件 return "File uploaded successfully!"; } } ``` 3.在前端使用AJAX来发送异步请求上传Excel文件: ``` $(document).ready(function() { $('#uploadForm').submit(function(event) { event.preventDefault(); uploadFile(); }); function uploadFile() { var formData = new FormData(); formData.append('file', $('#file')[0].files[0]); $.ajax({ url: '/upload', type: 'POST', data: formData, processData: false, contentType: false, success: function(response) { alert(response); }, error: function(jqXHR, textStatus, errorThrown) { alert(textStatus + ': ' + errorThrown); } }); } }); ``` 4.在后端处理上传的Excel文件并返回数据: ``` @PostMapping("/upload") public ResponseEntity<List<String>> uploadFile(@RequestParam("file") MultipartFile file) throws IOException { List<String> data = new ArrayList<>(); Workbook workbook = new XSSFWorkbook(file.getInputStream()); Sheet sheet = workbook.getSheetAt(0); for (Row row : sheet) { for (Cell cell : row) { data.add(cell.toString()); } } workbook.close(); return ResponseEntity.ok(data); } ``` 这个例子中,我们读取Excel文件的第一个工作表的所有单元格的值,并将它们作为字符串添加到一个字符串列表中。最后,我们使用`ResponseEntity`来将数据作为JSON对象返回到前端
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值