Ocultar imagen usando Javascript después de que se complete la acción del controlador MVC3

Question

Mi aplicación se implementó utilizando MVC 3, .net. Estoy tratando de generar un archivo de Excel con solo hacer clic en un botón. La llamada a la acción del controlador se realiza utilizando Ajax. Mi problema principal es: Durante la generación de archivos, intento mostrar una imagen en la pantalla para informar al usuario de la operación entrante. Puedo mostrar muy bien la imagen, pero no puedo ocultarla después de que se complete la operación. Los codei estoy usando es: Código

Javascript: Código

$("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; 
}); 

Acción controlador:

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); 
     } 
} 

no vuelvo resultado JSON para el llamado javascript método donde puedo escribir el código para esconde la imagen Estoy devolviendo un archivo que puede guardar el usuario y la acción se completa.

¿Por favor, sugiéveme/ayúdame de cómo puedo ocultar la imagen una vez que se completa la operación de generación de archivos?

aprecio la ayuda ...

Answer 1

Usted puede pedir la following article y poner esto en acción. Así que empezamos definiendo un controlador:

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"); 
    } 
} 

y en la vista:

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

Ahora el último paso es incluir la jquery.cookie plugin:

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

y escribir un script para suscríbase al evento click del anclaje y rastree el progreso de la descarga:

$(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); 
    }); 
});