JQuery 中怎么利用Ajax 导出报表

发布时间:2021-06-18 17:29:46 作者:Leah
来源:亿速云 阅读:369

JQuery 中怎么利用Ajax 导出报表,很多新手对此不是很清楚,为了帮助大家解决这个难题,下面小编将为大家详细讲解,有这方面需求的人可以来学习下,希望你能有所收获。

利用Ajax发送Get请求

        js代码

$.ajax({
            type: "GET",
            url: encodeURI("http://localhost:8080/a?dd=" + dayinList+"),
            beforeSend: function () {
            },
            success: function (msg) {
            },
            error: function () {
            }
        })

        后台代码

@RestController
public class LogDownloadApi { 


    @GetMapping("/a")
    public void cs(@RequestParam("dd") String aa){
        System.out.println(aa);
    }

}

利用Ajax发送POST请求

        js代码

$.ajax({ 
      type : "POST", 
      url : "http://localhost:8080/logDownload", 
      data : JSON.stringify({
            logList : dayinList,//数据List
            logName : "logName"//数据String
        }), 
      contentType : "application/json", 
      dataType : "json", 
      success: function (msg) {
         //成功执行
            },
      error: function () {
      //失败执行
            }
    });

        后台代码

@RestController
public class LogDownloadApi { 


@PostMapping("/logDownload")
    public void ajaxPost(@RequestBody  Map map){
        System.out.println(map);
    }


}

利用POST请求,导出报表

        js代码

<button class="btn btn-primary pull-right" onclick="outputResult(' + id + ')">导出查询结果</button>
 /*导出选择,并下载*/
    function outputResult(str) {
        var logName=document.getElementById("logName").textContent;
        console.log(logName)
        var dayinList = [];
        var List = $(".checkbox" + str.id + ":checked");
        for (var i = 0; i < List.length; i++) {
            dayinList.push(List[i].value)
        }
        var xhr = new XMLHttpRequest();
        xhr.open('post', 'http://localhost:8080/logDownload', true);
        xhr.responseType = 'blob';
        xhr.setRequestHeader('Content-Type', 'application/json;charset=utf-8');
        xhr.onload = function () {
            if (this.status == 200) {
                var blob = this.response;
                var a = document.createElement('a');
                var url = window.URL.createObjectURL(blob);
                a.href = url;
                //设置文件名称
                a.download = logName+'.xls';
                a.click();
            }
        };
        xhr.send(JSON.stringify({
            logList : dayinList,//数据源
            logName : logName//文件名
        }));
    }

        后台POST方法

@RestController
public class LogDownloadApi {

    private final InputExcelService inputExcelService;

    public LogDownloadApi(InputExcelService inputExcelService) {
        this.inputExcelService = inputExcelService;
    }


    @PostMapping("/logDownload")
    public void aa(@RequestBody  Map map,
                   @Context HttpServletResponse response,
                   @Context HttpServletRequest request) {
        List list = (List) map.get("logList");
        String logName = (String) map.get("logName");
        String fileName = logName.substring(1, logName.length());
        try {
            inputExcelService.exportExcel(response, request, list, fileName);
        } catch (Exception e) {
            e.printStackTrace();
        }
    }


}
package com.yx.http.service;

import org.apache.poi.hssf.usermodel.*;
import org.apache.poi.ss.util.CellRangeAddress;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.stereotype.Service;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.OutputStream;
import java.io.UnsupportedEncodingException;
import java.net.URLEncoder;
import java.text.SimpleDateFormat;
import java.util.*;

/**
 * Created by gao on 2018/12/24.
 * 报表下载
 */
@Service
public class InputExcelService {

    private SimpleDateFormat simpleDateFormat = new SimpleDateFormat("yyyy年MM月dd-hh-mm-ss");


    /**
     * 创建报表
     *
     * @param response                           请求响应信息
     * @param request                            请求信息
     * @param logList                            日志数据结果
     * @param xlsName                            报表名称
     * @throws Exception 抛出异常错误
     */
    public void exportExcel(HttpServletResponse response, HttpServletRequest request, List<String> logList, String xlsName)throws Exception{
        /*第一步创建workbook*/
        HSSFWorkbook wb = new HSSFWorkbook();
        /*给表格簿赋值*/
        HSSFSheet sheet = wb.createSheet("日志数据");
        /*设置打印页面为水平居中*/
        sheet.setHorizontallyCenter(true);
        /*第三步创建行row:添加表头0行*/
        HSSFRow row = sheet.createRow(0);
        /*创建表标题与列标题单元格格式*/
        HSSFCellStyle style = wb.createCellStyle();
        /*居中*/
        style.setAlignment(HSSFCellStyle.ALIGN_CENTER);
        /*下边框*/
        style.setBorderBottom(HSSFCellStyle.BORDER_THIN);
        /*左边框*/
        style.setBorderLeft(HSSFCellStyle.BORDER_THIN);
        /*上边框*/
        style.setBorderTop(HSSFCellStyle.BORDER_THIN);
        /*右边框*/
        style.setBorderRight(HSSFCellStyle.BORDER_THIN);
        HSSFFont font = wb.createFont();
        font.setFontHeightInPoints((short) 16);
        style.setFont(font);

        /*创建表格内数据格式*/
        HSSFCellStyle styleCell = wb.createCellStyle();
        /*居中*/
        styleCell.setAlignment(HSSFCellStyle.ALIGN_CENTER);
        /*下边框*/
        styleCell.setBorderBottom(HSSFCellStyle.BORDER_THIN);
        /*左边框*/
        styleCell.setBorderLeft(HSSFCellStyle.BORDER_THIN);
        /*上边框*/
        styleCell.setBorderTop(HSSFCellStyle.BORDER_THIN);
        /*右边框*/
        styleCell.setBorderRight(HSSFCellStyle.BORDER_THIN);
        HSSFFont fontCell = wb.createFont();
        fontCell.setFontHeightInPoints((short) 14);
        styleCell.setFont(fontCell);
        /*创建下标为0的单元格*/
        row = sheet.createRow(0);
        /*设定值  row.createCell列名*/
        HSSFCell cell = row.createCell(0);
        cell.setCellValue("日志数据");
        cell.setCellStyle(style);
        for (int i = 0; i < 12; i++) {
            cell = row.createCell(i + 1);
            cell.setCellValue("");
            cell.setCellStyle(style);
        }
        /*起始行,结束行,起始列,结束列*/
        CellRangeAddress callRangeAddress = new CellRangeAddress(0, 0, 0, 12);
        sheet.addMergedRegion(callRangeAddress);
        /*创建下标为1行的单元格*/
        row = sheet.createRow(1);

        /*设定值*/
        cell = row.createCell(0);
        cell.setCellValue("序号");
        /*内容居中*/
        cell.setCellStyle(style);
        /*设定值*/
        cell = row.createCell(1);
        cell.setCellValue("日志数据");
        cell.setCellStyle(style);
        /*自适应宽度*/
        for (int i = 0; i <= 13; i++) {
            sheet.autoSizeColumn(i);
            sheet.setColumnWidth(i, sheet.getColumnWidth(i) * 12 / 10);
        }
        /*第五步插入数据*/
        /*创建行(可在此for循环插入数据 row = sheet.createRow(i + 2))*/
        for (int i = 0; i < logList.size(); i++) {
            row = sheet.createRow(2+i);
            //创建单元格并且添加数据
            cell = row.createCell(0);
            cell.setCellValue(i+1);
            cell.setCellStyle(style);
            cell = row.createCell(1);
            cell.setCellValue(logList.get(i));
            cell.setCellStyle(style);

        }
        String fileName = xlsName + ".xls";
        String rtn = "";

            fileName = URLEncoder.encode(fileName, "UTF8");

        String userAgent = request.getHeader("User-Agent");
        /*针对IE或者以IE为内核的浏览器:*/
        if (userAgent != null) {
            userAgent = userAgent.toLowerCase();
            /*IE浏览器,只能采用URLEncoder编码*/
            if (userAgent.indexOf("msie") != -1) {
                rtn = "filename=\"" + fileName + "\"";
            }
            /*Opera浏览器只能采用filename**/
            else if (userAgent.indexOf("opera") != -1) {
                rtn = "filename*=UTF-8''" + fileName;
            }
            /*Safari浏览器,只能采用ISO编码的中文输出*/
            else if (userAgent.indexOf("safari") != -1) {
                try {
                    rtn = "filename=\"" + new String(fileName.getBytes("UTF-8"), "ISO8859-1") + "\"";
                } catch (UnsupportedEncodingException e) {
                    e.printStackTrace();
                }
            }
            /*Chrome浏览器,只能采用MimeUtility编码或ISO编码的中文输出*/
//            else if (userAgent.indexOf("applewebkit") != -1) {
//                fileName = MimeUtility.encodeText(fileName, "UTF8", "B");
//                rtn = "filename=\"" + fileName + "\"";
//            }
            /* FireFox浏览器,可以使用MimeUtility或filename*或ISO编码的中文输出*/
            else if (userAgent.indexOf("mozilla") != -1) {
                rtn = "filename*=UTF-8''" + fileName;
            }
        }
        response.setContentType("application/vnd.ms-excel");
        response.setHeader("Content-Disposition", "attachment;" + rtn);
        response.setCharacterEncoding("UTF-8");
        OutputStream outputStream = null;
            outputStream = response.getOutputStream();
            wb.write(outputStream);
            outputStream.flush();
            outputStream.close();

    }


    /**
     * 排序
     * @param list
     * @param orderByParams
     * @return
     */
    public static List<Map<String, Object>> listContainMapSortByStringAsc(List<Map<String, Object>> list, String orderByParams) {

        Collections.sort(list, new Comparator<Map<String, Object>>() {
            @Override
            public int compare(Map<String, Object> o1, Map<String, Object> o2) {
                /*name1是从你list里面拿出来的一个*/
                String name1 = o1.get(orderByParams).toString();
                /*name1是从你list里面拿出来的第二个name*/
                String name2 = o2.get(orderByParams).toString();
                return name1.compareTo(name2);
            }
        });
        return list;
    }

}

看完上述内容是否对您有帮助呢?如果还想对相关知识有进一步的了解或阅读更多相关文章,请关注亿速云行业资讯频道,感谢您对亿速云的支持。

推荐阅读:
  1. 沫沫金:jQuery EasyUI 动态表头
  2. 基于jquery如何实现左右上下移动效果

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

jquery ajax

上一篇:mysql 中怎么区分读写分离数据源

下一篇:python清洗文件中数据的方法

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》