Part 96 - LoadingElementDuration property of AjaxOptions class

Suggested Videos 
Part 93 - What is Ajax and why should we use it
Part 94 - Providing visual feedback using LoadingElementId AjaxOption
Part 95 - OnBegin, OnComplete, OnSuccess and OnFailure properties of AjaxOptions class



This is continuation to Part 95, Please watch Part 95 from the ASP.NET MVC tutorial before proceeding with this video.

LoadingElementDuration property is used to control the animaion duration of LoadingElement. The value for LoadingElementDuration property must be specified in milliseconds. By default, the LoadingElement fades in and fades out.



But I noticed that, irrespective of whatever duration you set, the LoadingElement was fading in and out at the same speed. I have done some research on google and came across the following stackoverflow article which explained the fix for the issue.
http://stackoverflow.com/questions/8928671/asp-net-mvc-3-loadingelementduration-not-working

To fix the issue, we need to parse the duration to integer. Open "jquery.unobtrusive-ajax.js" and change the following line 
FROM
duration = element.getAttribute("data-ajax-loading-duration") || 0;
TO
duration = parseInt(element.getAttribute("data-ajax-loading-duration")) || 0;

After you have made the change, reference "jquery.unobtrusive-ajax.js" file in the "Index" view
<script src="~/Scripts/jquery.unobtrusive-ajax.js" type="text/javascript"></script>

Finally set, LoadingElementDuration and test your application
@Ajax.ActionLink("All", "All", 
    new AjaxOptions 
    {
      HttpMethod = "GET", 
      UpdateTargetId = "divStudents", 
      InsertionMode = InsertionMode.Replace, 
      LoadingElementId = "divloading",
      OnBegin = "ClearResults",
      OnSuccess = "CountRows",
      LoadingElementDuration = 2000
    })