Question

我正在经历一个令人困惑的情况，当点击按钮时，应该下载pdf。我的设计和要求如下：

点击按钮
显示包含两个按钮save和open
如果选择了保存，则pdf应保存在本地计算机上。

第3点是我遇到问题的地方因为没有确认框。在使用submit button（无确认框）提交表单时，文件将被下载。以下是代码：

<button type="submit" id="Export">xxx_tutorial</button>

但是当jQuery中只有button带onclick事件的确认框时，我使用$Post将数据提交给servlet，其中数据传递给servlet但是文件没有下载。

现在我的问题是：

通过$post传递数据不等同于submit，同时将数据传递给servlet，点击提交按钮时会发生什么。
当数据传递给servlet时，为什么在没有确认框的情况下使用提交按钮时，相同代码工作的文件没有被下载。

以下是代码：

JSP：

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.2/themes/redmond/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.11.2.js"></script>
<script src="https://code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
<!-- User Defined Js file -->
<script type="text/javascript">

$(document).ready(function(){
          $('#Export').click(function(event) {  
          event.preventDefault();
        var currentForm = $(this).closest('form');

        var dynamicDialog = $('<div id="conformBox">'+
        '<span style="float:left; margin:0 7px 20px 0;">'+
        '</span>Open or save the document</div>');

        dynamicDialog.dialog({
                title : "Open/Save Dialog",
                closeOnEscape: true,
                modal : true,

               buttons : 
                        [{
                                text : "Export",
                                click : function() {

                                    $(this).dialog("close");
                                    var data = "xxx_tutorial";
                                    $.post('button', {param: data}, function(param){


            });
                                }
                        },
                        {
                                text : "Open",
                                click : function() {
                                        $(this).dialog("close");
                                }
                        }]
        });
        return false;
    });

}); 
</script>
</head>
<body>
        <button type="button" id="Export">xxx_tutorial</button>

</body>
</html>

的Servlet

package com.testcase.testing;

import java.io.File;
import java.io.FileInputStream;
import java.io.IOException;
import java.io.OutputStream;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
 * Servlet implementation class button
 */
@WebServlet("/button")
public class button extends HttpServlet {
    private static final long serialVersionUID = 1L;

    /**
     * @see HttpServlet#HttpServlet()
     */
    public button() {
        super();
        // TODO Auto-generated constructor stub
    }

    /**
     * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
     */
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        // TODO Auto-generated method stub
        doPost(request, response);
        }

    /**
     * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
     */
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        // TODO Auto-generated method stub

        response.getWriter().append(request.getParameter("param"));
        performTask(request,response);
    }

    private void performTask(HttpServletRequest request, HttpServletResponse response) throws ServletException,
    IOException {

        String pdfFileName="";

        if(request.getParameter("param")==null){

    }
    else if(request.getParameter("param").matches("sap_webi_tutorial")){
        System.out.println("in create pdf file name part");
        pdfFileName = "/"+request.getParameter("param")+".pdf";
    }
        else{

        }

String contextPath = getServletContext().getRealPath(File.separator);
File pdfFile = new File(contextPath + "/xxx_tutorial.pdf"); 
response.setContentType("application/pdf");
response.addHeader("Content-Disposition", "attachment; filename=" + "/xxx_tutorial.pdf");
response.setContentLength((int) pdfFile.length());

FileInputStream fileInputStream = new FileInputStream(pdfFile);
PrintWriter responseOutputStream = response.getWriter();
int bytes;
    while ((bytes = fileInputStream.read()) != -1) {
    responseOutputStream.write(bytes);
}
fileInputStream.close();
responseOutputStream.flush();
responseOutputStream.close();
    }
}

Answer 1

如果您submit表单，浏览器中显示的页面将收到该操作的结果 - 就像点击链接一样说。

调用$.post()将在后台发送数据，并将结果数据返回到您的回调函数（您发布的代码中为空）。因此，您必须处理该功能的结果。

请参阅post documentation了解背景

也许你可以做你的逻辑然后调用$.post()而不是简单地从JavaScript代码中提取表单？

选中此项以直接提交表单：

JavaScript post request like a form submit

当使用Submit和$ post of Jquery时，程序的行为会有所不同

1 个答案: