2008-11-13 88 views
13

Tengo un controlador MVC que se ejecuta a través de un proceso, establece algunos datos de visualización y luego devuelve los resultados de estos datos al usuario en una vista. El tiempo de proceso depende de la cantidad de datos que se procesa. Necesito una buena manera de mostrar un .gif animado dentro de la Vista mientras el proceso se está ejecutando, para que el usuario sepa que algo está sucediendo.ASP.Net MVC Indicador de carga en progreso

He examinado varios métodos AJAX y vistas parciales, pero todavía no puedo encontrar una buena manera de lograr esto. Lo que realmente deseaba era poder tener un ActionFilter que devolviera una Vista o Vista parcial durante el evento OnActionExecuting que muestra este .gif animado, luego una vez que el Controlador completara el proceso y devolviera ViewData, la vista o la vista parcial con la Vista real Los datos pueden ser mostrados.

También parece que jQuery sería capaz de proporcionar una buena forma asíncrona para llamar a la acción del controlador en el fondo y luego renderizar la Vista. Cualquier ayuda sería apreciada.

Respuesta

24

En su controlador:

public JsonResult GetSomething(int id) 
{ 
    return Json(service.GetSomething(id)); 
} 

En la vista (Javascript, usando jQuery):

$('#someLink').click(function() 
{ 
    var action = '<%=Html.ResolveUrl("~/MyController.mvc/GetSomething/")%>' + $('#someId').val() + '?x=' + new Date().getTime(); 
    $('#loading').show() 
    $.getJSON(action, null, function(something) 
    { 
     do stuff with something 
     $('#loading').hide() 
    }); 
}); 

Tenga en cuenta que esto supone un recorrido donde 'id' se produce después de la acción. El parámetro 'x' en la acción es para derrotar el almacenamiento en caché agresivo en IE.

En la vista (marcado):

<img id="loading" src="images/ajax-loader.gif" alt=""/> 
<!-- use a css stlye to make display:none --> 

Get cargador gifs here.

También tenga en cuenta que no tiene que hacer esto con Json. Puede buscar otras cosas como HTML o XML desde la acción del controlador si lo prefiere.

+0

tuve que agregar un # a la 'carga' para que sea recogido así que $ ('# loading'). Show() y $ ('# loading'). Hide() para las dos piezas JS. .. en general, gracias por el JS ... eso fue perfecto ... –

Cuestiones relacionadas