Your Html.ActionLink()
will generate a html
similar to this:
<a href="/DeliveryService/Import">Importar</a>
Once done, just intercept the requests and display the GIF.
Below is a simple example of how to do this:
$('a').click(function(){
$('#loadingFull').fadeIn();
});
Note that as the page will be updated, you do not need $('#loadingFull').fadeOut();
.
See a simple example below:
$('a').click(function() {
$('#loadingFull').fadeIn();
});
div#loadingFull {
position: fixed;
left: 0;
top: 0;
z-index: 999;
width: 100%;
height: 100%;
overflow: visible;
background: #333 url('http://files.mimoymima.com/images/loading.gif') no-repeat center center;
display: none;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="loadingFull"></div>
<a href="#">Importar</a>
To the submit()
you can do something similar, but instead .click()
, you can use the .Submit().
Apparently you are using Asp.NET MVC
. With this, you can add the code to your file _Layout.cshtml
that the same will serve for all pages.
The example of the Loader I removed from here.
See if this no longer solves, make a function to call ajax: @Html.Actionlink("Import", "Import", "Deliveryservice",null, new { onclick="functionDoGif" })
– AnthraxisBR
@Anthraxisbr this could even answer me, however I would have to put this in all system calls, only the menu are more than 20 calls, It turns out not a good idea, wanted something more generic.
– Vinicius
In this case is not feasible, I think you will have to simulate an 'ajax Listener', take a look at this question: https://stackoverflow.com/questions/3596583/javascript-detect-an-ajax-event not with time to make a decent answer now
– AnthraxisBR
Will be for all links of your site without exception?
– Randrade
@Anthraxisbr did a quick test here with one of the answers and it seems that this is the way, thank you.
– Vinicius
@Randrade yes, I want the user to know that something is being processed.
– Vinicius