在带有“请稍候”消息的新选项卡中打开表格

Question

I'm trying to display PDF in a new tab after submitting a form. However, exporting a PDF takes a while so when users click export, new blank tab opens and there's no clear indication what is happening.

To open form result in a new tab I'm using:

@using (Html.BeginForm("Export", "Reviews", FormMethod.Post, new { target = "_blank" } ))

and method in the controller is:

public FileStreamResult Export(int presentationID, int[] selectedViews)
{
    ...

    return new FileStreamResult(stream, "application/pdf");            
}

Is there a way to put a preloader in body of a new tab or open a tab only after PDF is ready to display? I don't want to use window.open() as this creates a popup which is blocked by default.

Ajax File download Issue describes similiar problem but in my case I don't want the PDF to be downloaded but opened in a new tab.

Answer 1

Maybe someone will find it helpful:

What I ended up doing is creating a new View which accepts values from the form. New view is opened in a new tab after form submit and contains just a 'please wait' message. After document is loaded it immediately redirects to pdf export method using JavaScript. It's a bit dirty but works.

@{
    var url = Url.Action("Export", "Reviews", new { presentationID = Model.PresentationID });
    var sb = new System.Text.StringBuilder(url);

    foreach (var view in Model.SelectedViews)
    {
        sb.AppendFormat("&selectedViews={0}", view);
    }
}

<div class="export-wait">
    <i class="fa fa-spinner fa-spin fa-3x"></i>
    <h2>Please wait</h2>
    <p>
        Your report is being prepared, this may take a few minutes...
    </p>
</div>

<script>
    window.location = '@Html.Raw(sb.ToString())';
</script>