Question

I have a web development using ASP.NET MVC 4 in progress, using the Web framework KendoUI that need use a Ajax Loader on time to order another "VIEW" on system. Ajax Loader will runs in the request "VIEW" with delay of request actions on system. So the user will know that clicking on an item there is a procedure to request the action, and not need multiple clicks on the screen. I need a direction to take. Thanks.

Was it helpful?

Solution

I choose to do it this way, this will cover for all Ajax actions on my site.

HTML

<div id="GlobalMsg">
    <img src="~/loading.gif" /></div>

CSS

#GlobalMsg {
    /*padding: 25%;*/
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.2);
    z-index: 999999 !important;
    display: block;
    position: fixed;
    top: 0px;
    left: 0px;
}

jQuery

$('#GlobalMsg')
            .hide()
            .ajaxStart(function () {
                $(this).show();
               // Any other handling
            })
            .ajaxStop(function () {
                $(this).hide();
                // Any other handling
            }).ajaxError(function (event, jqxhr, settings, exception) {
                // Any other handling
            });
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top