Tengo una aplicación web con el típico "Admin template", el menú lateral con las opciones y el contenido. El menú está definido en una vista parcial que se carga en el layout.
Algunas de las vistas a las que se navega tardan en cargar, y quiero mostrar algún tipo de mensaje (spinner, texto o lo que sea) al usuario para que vea que está "trabajando" y no se ha colgado.
La idea sería que al pulsar en el menú se mostrara el mensaje bloqueando la pantalla y al terminar de cargarse la vista dicho mensaje desapareciera.
He visto algún ejemplo y el mostrarlo al pulsar en una opción de menú creo que sabría como hacerlo, pero ¿cómo hago para que desaparezca una vez se ha cargado la vista?
Añado más información a mi pregunta, a ver si me explico mejor...
En la vista parcial del menú que cargo en el layout tengo algo así:
<a href="@Url.RouteUrl("Default", new { action = "Nuevo", controller = "Producto" })" class="sidenav-link"><div>Nuevo producto</div></a>
y en la vista de nuevo producto he puesto estos alerts de js.
$(function () {
alert('Evento ready');
});
$(window).on('load', function (e) {
alert('Evento load');
});
La secuencia ahora mismo es la siguiente estando en el menú principal y visualizando la vista dashboard:
1. Click en la opción de menú 'Nuevo producto'.
2. Un tiempo de espera de unos 15seg. mientras se sigue viendo la vista dashboard.
3. Se muestra el alert 'Evento ready'.
4. Se muestra el alert 'Evento load'.
Lo que yo quiero es que el "cargando...' se muestre nada más hacer click en la opción del menú (paso 1) y se esté visualizando hasta el 'Evento load'.