6

私のアプリケーションはMVC3、.netを使用して実装されています。ボタンをクリックするだけでExcelファイルを生成しようとしています。コントローラアクションの呼び出しは、Ajaxを使用して行われます。私の主な問題は次のとおりです。ファイルの生成中に、画面に画像を表示して、ユーザーに進行中の操作を知らせようとしています。画像は上手く表示できますが、操作終了後は非表示にできません。使用しているcodeiは：

Javascriptコード：

$("input.DownloadExcelReport").click(function (e) {
   e.preventDefault();
   var parameter = -- code to fetch parameter value;
   var outputViewUrl = (the url is created here);
   showLoading(); -- This function displays the image
   window.location.href = outputViewUrl;
});

コントローラアクションコード：

public ActionResult DownExcelReportForAssortment(Guid parameter)   
{

       try
       {

           //the contents for the file generation are fetched here..   
           // Write contents to excel file
           if (memoryStream != null)
           {
                var documentName = "Report.xls";
                byte[] byteArrary = memoryStream.ToArray();
                return File(byteArrary, "application/vnd.ms-excel", documentName);
           }
       }
       catch (Exception ex)
       {
           LogManager.LogException(ex);
       }
}

画像を非表示にするコードを記述できる呼び出し元のjavascriptメソッドにJsonの結果を返しません。ユーザーが保存できるファイルを返し、アクションが完了しました。

ファイル生成操作が完了したら、画像を非表示にするにはどうすればよいかを誰かに提案/助けてもらえますか？

ヘルプに感謝します...

4

1 に答える 1

11

次の記事をチェックアウトして、これを実行に移すことができます。したがって、コントローラーを定義することから始めます。

public class HomeController : Controller
{
    public ActionResult Index()
    {
        return View();
    }

    public ActionResult DownExcelReportForAssortment(Guid parameter, string tokenId)
    {
        // Simulate some heavy work to fetch the report
        Thread.Sleep(5000);

        // we fake it
        byte[] byteArray = System.IO.File.ReadAllBytes(@"c:\test.xls");

        var cookie = new HttpCookie("fileDownloadToken", tokenId);
        Response.AppendCookie(cookie);

        return File(byteArray, "application/vnd.ms-excel", "report.xls");
    }
}

とビューで：

@Html.ActionLink(
    "download report",
    "DownExcelReportForAssortment",
    "Home",
    new { parameter = Guid.NewGuid(), tokenId = "__token__" },
    new { @class = "download" }
)

最後のステップは、jquery.cookieプラグインを含めることです。

<script type="text/javascript" src="@Url.Content("~/scripts/jquery.cookie.js")"></script>

アンカーのクリックイベントをサブスクライブし、ダウンロードの進行状況を追跡するスクリプトを記述します。

$(function () {
    var fileDownloadCheckTimer;

    $('.download').click(function () {
        var token = new Date().getTime();
        $(this).attr('href', function () {
            return this.href.replace('__token__', token);
        });

        // Show the download spinner
        $('body').append('<span id="progress">Downloading ...</span>');

        // Start polling for the cookie
        fileDownloadCheckTimer = window.setInterval(function () {
            var cookieValue = $.cookie('fileDownloadToken');
            if (cookieValue == token) {
                window.clearInterval(fileDownloadCheckTimer);
                $.cookie('fileDownloadToken', null);

                // Hide the download spinner
                $('#progress').remove();
            }
        }, 1000);
    });
});
于 2012-07-26T17:12:07.307 に答える