[Full Screen Ajax Wait] What is the best way to 'mute' full screen loader?

Forge Component
(7)
Published on 2018-07-19 by Pedro Coelho
7 votes
Published on 2018-07-19 by Pedro Coelho

What would be the best way to hide a loader when I'm using an autocomplete or bulk select? Currently, it just blinks too much. 

Solution

Roman wrote:

What would be the best way to hide a loader when I'm using an autocomplete or bulk select? Currently, it just blinks too much. 

At your onChange use a runJavaScript Action with : 

"RichWidgets_Feedback_AjaxWait_End('divWait');"

At your JS Screen Proprieties write this JS Code,


function RichWidgets_Feedback_AjaxWait_End(divId) {
 $(function($) {
       clearTimeout(RichWidgets_Feedback_AjaxWait_ajaxWaitMessageTimer);
       RichWidgets_Feedback_AjaxWait_ajaxWaitMessageTimer = null;
       $('body').removeClass('Feedback_AjaxWait_CursorProgress');
       $( ".Feedback_AjaxWait" ).css("display","none");
 });
}



Test and give your feedback.

I already had that problem and with this aproach worked.


Solution

Hi Pedro, 

It's helpful, however, I still was able to see the loader. I've added a timer to your code and it seems to work now. Let me know what you think about it. 

function RichWidgets_Feedback_AjaxWait_End(divId) {
     $(function($) {
        var timerId = setInterval(function() {
            clearTimeout(RichWidgets_Feedback_AjaxWait_ajaxWaitMessageTimer);
            RichWidgets_Feedback_AjaxWait_ajaxWaitMessageTimer = null;
            $('body').removeClass('Feedback_AjaxWait_CursorProgress');
            $( ".Feedback_AjaxWait" ).css("display","none");
        }, 100);

    setTimeout(function() {
      clearInterval(timerId);      
    }, 1000);
                   
 });
} 

Roman wrote:

Hi Pedro, 

It's helpful, however, I still was able to see the loader. I've added a timer to your code and it seems to work now. Let me know what you think about it. 

function RichWidgets_Feedback_AjaxWait_End(divId) {
     $(function($) {
        var timerId = setInterval(function() {
            clearTimeout(RichWidgets_Feedback_AjaxWait_ajaxWaitMessageTimer);
            RichWidgets_Feedback_AjaxWait_ajaxWaitMessageTimer = null;
            $('body').removeClass('Feedback_AjaxWait_CursorProgress');
            $( ".Feedback_AjaxWait" ).css("display","none");
        }, 100);

    setTimeout(function() {
      clearInterval(timerId);      
    }, 1000);
                   
 });
} 


Like i said, when i had the problem, that code worked. With that SetTimeout is an improvement =)


Glad i helped =)