以excel格式下载动态数据表

时间:2019-05-27 07:26:47

标签: javascript java jquery model-view-controller

我有一个动态生成的数据表,其中包括标题。数据来自在后台运行的sql查询,并创建了一个模型和视图,并使用模型占位符在前面捕获了该模型和视图。我无法弄清楚如何为数据表添加“下载为CSV”。友善的帮助

<hr class="m-2" />
    <!-- data -->
    <section id="data" class="mb-1 mt-5">
        <div class="container-fluid">
            <div class="row">
                <div class="col-md-12">
                <!-- <div id="wait" style="display:none">loader</div> -->
                    <div class="table-responsive">
                        <table class="table table-sm table-bordered bg-white" id="data">
                            <tbody>
                                <tr th:each="ftids:${ftids}">
                                    <th:block th:each="track:${ftids}">
                                        <td th:text="${track}"></td>
                                    </th:block>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </section>





    <br />



    <!--Footer-->
    <!-- <img src="/report/img/processing.gif" id="wait" style="display:none" /> -->
    <th:block th:include="~{shared::footer}"></th:block>
    <th:block th:include="~{shared::mdbjs}"></th:block>
    <script type="text/javascript" th:src="@{/jquery-ui.min.js}"></script>
    <script type="text/javascript"
        src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
    <script type="text/javascript"
        src="https://cdn.datatables.net/buttons/1.5.2/js/dataTables.buttons.min.js"></script>
    <script type="text/javascript"
        src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
    <script type="text/javascript"
        src="https://cdn.datatables.net/buttons/1.5.2/js/buttons.html5.min.js"></script>
    <script type="text/javascript">
        $("#imeiinfo").hide();
        $("#tidinfo").hide();
        $("#oidinfo").hide();
        $("#btn").hide();
        $("#btntid").hide();

        $("#stype").change(function() {
            var svalue = $("#stype").val();
            if (svalue != "oids" && svalue != "tids") {
                $("#oidinfo").hide();
                $("#tidinfo").hide();
                $("#imeiinfo").show();
                $("#btn").show();
            } else if (svalue != "imei" && svalue != "tids") {
                $("#imeiinfo").hide();
                $("#tidinfo").hide();
                $("#oidinfo").show();
                $("#btn").show();
            } else {
                $("#imeiinfo").hide();
                $("#oidinfo").hide();
                $("#tidinfo").show();
                $("#btn").show();
                $("#btntid").show();
            }
        });
        $("table#data > tbody > tr:first-child").css({
            'background-color' : 'black',
            'color' : 'white',
            'font-weight' : 'bold'
        });
        console.log("#ftids");
        $('#btntid').click(function(){
        var ftids="[[${ftid}]]";
        console.log(ftids);
        $('#btntid').attr('href','/order/excel/download/tid?ftids='+ftids);
        });

         $('table#data').DataTable({
            dom: 'Bfrtip',
            buttons: [
                {
                  "extend":'excel',
                  "text":'<i class="fa fa-fw fa-file-excel-o"></i>Export to Excel',
                  "className": 'btn btn-primary btn-md',
                }
            ]
          }); 
        </script>
</body>

</html>

controller:

@PostMapping("/detail/search")

    public ModelAndView postIMEIDetails(@RequestParam("imei") final String imei,
            @RequestParam("oids") final String oids, @RequestParam("ftids") final String ftids) {
        ModelAndView modelAndView = new ModelAndView("/orderidsearch");

        if (imei != null && oids.isEmpty() && ftids.isEmpty()) {
            String imei2 = imei.replaceAll("\r\n", ",");
            String imei1[] = imei2.split(",");
            modelAndView.addObject("imei", orderIdService.postDetails(imei1));
            modelAndView.addObject("loader", false);
        return modelAndView;
        }

        else if (oids != null && imei.isEmpty() && ftids.isEmpty()) {
            String oid2 = oids.replaceAll("\r\n", ",");
            String oid1[] = oid2.split(",");
            modelAndView.addObject("oids", orderIdService.postOidDetails(oid1));
            return modelAndView;
        }

        else if (ftids != null && imei.isEmpty() && oids.isEmpty()) {
            String ftid1 = ftids.replaceAll("\r\n", ",");
            String ftid[] = ftid1.split(",");
            modelAndView.addObject("ftid", ftid);
            modelAndView.addObject("ftids", orderIdService.postFTIDdetails(ftid));
            return modelAndView;
        }
        return modelAndView;

}

每次生成数据表时我都会收到控制台错误。但是没有下载选项

0 个答案:

没有答案