带有辅助iFrame提交的ASP FileUpload每页刷新仅工作一次

Question

我的目标是使用JS，jQuery和iFrame在我的Web部件上进行文件上传，以免刷新页面。 这是我的代码

在ASP HTML页面中

<div class="DocumentUploader" id="DocumentUploader" style="position:relative">
    <div style="position:absolute; top:4px; left:6px"><asp:Literal runat="server" ID="litMultiChoiceDropDocument"></asp:Literal></div>
    <asp:FileUpload runat="server" ClientIDMode="Static" ID="fuMultiChoiceAddDocuments" AllowMultiple="true" onchange="DDPutDocument(); btnMultiChoiceAddDocuments.click()" BorderStyle="None" Width="100%" BackColor="Transparent" Style="padding:0px 0px 0px 0px; opacity:0; cursor:pointer" />
    <asp:Button runat="server" ClientIDMode="Static" ID="btnMultiChoiceAddDocuments" OnClick="btnMultiChoiceAddDocuments_Click" Style="display:none" />
</div>

和在Javascript中

var hiddenIFrameID = "hiddenUploader";
function DDPutDocument() {
    var iframe = document.createElement("iframe");
    iframe.id = hiddenIFrameID;
    iframe.style.display = "none";
    document.body.appendChild(iframe);
    document.getElementById("aspnetForm").target = hiddenIFrameID;

    docsRefreshed = false;
    DDRefreshDocuments();
}

var docsRefreshed = false;
function DDRefreshDocuments() {
    if (!docsRefreshed) {
        DDLoadDocuments();
        setTimeout(DDRefreshDocuments, 2500);
    }
    else {
        var iframe = document.getElementById(hiddenIFrameID);
        document.body.removeChild(iframe);
        document.getElementById("aspnetForm").removeAttribute("target");
    }
}

演练-

FileUpload onchange事件是从弹出文件对话框或拖动到FileUpload输入上的文件触发的。 -作品

onchange方法首先调用javascript方法DDPutDocument ，然后调用btnMultiChoiceAddDocuments.click() 。 -作品

DDPutDocument方法创建一个iFrame，并将第一个表单的目标分配为iFrame，以便对该表单的提交操作将提交iFrame，而不是表单。

btnMultiChoiceAddDocuments.click()事件提交表单，该表单实际上是在提交iFrame，并且按钮后面的一些代码获取文件并保存。

DDRefreshDocuments方法在其他地方被调用，并且被正确调用，该方法中的else语句也被正确调用，因此应该处理我的清理工作。

问题 -

对于页面加载后上载文件的第一个实例，JS方法执行，按钮单击事件触发iFrame上的提交，并且文件由背后的代码处理，这一切都很好。 尝试上载第二个文件时，JS方法无错误执行，并进入无限循环，尝试刷新文档列表（因为上载不起作用），但不上载文件。 btnMultiChoiceAddDocuments_Click事件或Page_Load事件均不会像在第一个上传实例中那样触发。 该页面需要重新加载才能再次工作。

Answer 1

遇到同样的问题。 对我来说，它与缓存有关。 我如何解决的是上传后从服务器返回值。 这将刷新服务器代码。 或者，您可以将无缓存设置为服务器后端。

这是我在webapi内的代码（不确定您是否使用webapi，但可以得到一些想法）

public HttpResponseMessage Post（[FromUri] FileAttachmentInfo fileAttachmentInfo）{//如果（Request.Content.IsMimeMultipartContent（））{HttpResponseMessage theResponse = null;

            string filepath = HttpContext.Current.Server.MapPath(ConfigurationManager.AppSettings["DCProfileFilePath"]);
            filepath += fileAttachmentInfo.DCId + "\\" + fileAttachmentInfo.Tab + "\\" + fileAttachmentInfo.Field + "\\" + fileAttachmentInfo.File;                

            //delete previous files and create File Path folder if not already created
            DeleteAndCreateFilePath(filepath);

            MyMultipartFormDataStreamProvider streamProvider = new MyMultipartFormDataStreamProvider(filepath);

            var task = Request.Content.ReadAsMultipartAsync(streamProvider).ContinueWith(t =>
            {
                if (t.IsFaulted || t.IsCanceled)
                    throw new HttpResponseException(HttpStatusCode.InternalServerError);

                var fileInfo = streamProvider.FileData.Select(i =>
                {
                    var info = new FileInfo(i.LocalFileName);
                    //return "File uploaded as " + info.FullName + " (" + info.Length + ")";
                    return info.Name;
                });
                return fileInfo;

            });

            // wait for task to complete. Not really async, is it?!
            task.Wait();
            // remove annoying header 
            theResponse.Content.Headers.Remove("Content-Disposition");
            return theResponse;

        }
        else
        {
            throw new HttpResponseException(Request.CreateResponse(HttpStatusCode.NotAcceptable, "Invalid Request!"));
        }
    }