Question

我正在编写Portlet函数，以便将excel文件上传到后端进行处理。

我希望页面不会刷新，并允许我在成功上传后更改页面。

我尝试使用Ajax上传文件，但无法正常工作。

html部分

<portlet:actionURL var="uploadWorkbook" name="uploadWorkbook"></portlet:actionURL>
<b>Please Upload a Document</b> 

 <form id = "UploadExcelForm" name ="UploadExcelForm" action="<%=uploadWorkbook%>" method="post" enctype="multipart/form-data">
<input type="file" id="uploadedFile" name="uploadedFile" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel">
<button type="submit"> Upload </button>
</form>

ajax部分

$("#UploadExcelForm").on('submit', (function(e) {
   if ($('#uploadedFile').val().trim().length == 0) {
        alert("Please choose a file!");
        return false;
    }else{
            $.ajax({
            url: uploadWorkbook,
            type: 'POST',
            cache: false,
            data: $('#UploadExcelForm').serialize(),
            processData: false,
            contentType: false,
            success: function(){}
        })
        e.preventDefault();
}
}));

后端部分（如何获取上传的文件）

public void uploadWorkbook(ActionRequest actionRequest,ActionResponse actionResponse) throws Exception{
        boolean submit = true;
        boolean success = false;
        UploadPortletRequest uploadPortletRequest = PortalUtil.getUploadPortletRequest(actionRequest); 
        String uploadedTemplateId = uploadPortletRequest.getParameter("templateId");

        File uploadedFile = uploadPortletRequest.getFile("uploadedFile", true); 
//to do sth on file...
}

Answer 1

尝试删除表单标签并从按钮中删除类型提交。

Answer 2

从type="submit"更改：

<button type="submit"> Upload </button>

收件人：

<button> Upload </button>

Answer 3

尝试从表单标签中删除action。

然后使用e.preventDefault()而不是return false并将其放在if/else语句之外。

Answer 4

更改：

<button type="submit"> Upload </button>

到

<button type="button"> Upload </button>

然后放

e.preventDefault();

如果条件外（因此对两个都执行）

Answer 5

其他答案在JS方面为您提供了一些提示，您应该遵循这些提示。在门户方面，您将发布到<portlet:actionURL/>，它将返回一个完全渲染的页面（甚至可能被Liferay的SPA框架拦截-尽管我不确定它是否处理显式的ajax调用。

如果您只想返回文件上传的结果（例如状态，JSON等），则可能要发布到<portlet:resourceURL/>，并在Java端的资源处理程序中进行处理，而不是动作处理程序。

发布到资源处理程序将不会呈现页面上的所有其他portlet，而操作处理程序则可以。

即使使用ajax提交表单也无法阻止刷新

5 个答案: