3

I have single field called Case and on its onchange event along with the apex method, it calls the JavaScript function where the loading indicator can be seen on the VF page like below:

enter image description here

Till here the job of the loading indicator is done and working fine, the problem starts now - the loading indicator doesn't stop and keeps loading. How do I stop it?

Any sort of help is appreciated.

VF code below:

<apex:page>
    <apex:form id="casePageForm">
        <apex:pageBlock title="Case" id="casePageBlock">
            <apex:pageBlockSection title="Case Detail" columns="1" collapsible="false" id="caseDetail">
                <apex:pageBlockSectionItem id="caseContactItem">
                    <apex:outputLabel value="Case" />
                    <apex:inputField value="{!ex.Case__c}" required="true" id="caseContact">
                        <apex:actionSupport event="onchange" action="{!obtainAddress}" rerender="ResContactAddress"
                                             onsubmit="showSpinner();"/>
                    </apex:inputField>
                </apex:pageBlockSectionItem>
            </apex:pageBlockSection>
    </apex:form>


<div id="opaque"/>
   <div id="spinner">
        <p align="center" style='{font-family:"Arial", Helvetica, sans-serif; font-size:20px; height:20px; width:20px;}'><apex:image value="/img/loading.gif"/>&nbsp;Please wait</p>
   </div>

   <script>
    function showSpinner()
    {
       document.getElementById('opaque').style.display='block';
       var popUp = document.getElementById('spinner');

       popUp.style.display = 'block';
    } 
   </script>

</apex:page>

Note: Haven't added the CSS in the above code.

5

The apex:actionSupport tag has an oncomplete attribute where you can call another JavaScript function that sets the display attributes to 'none'.

That call is performed when the AJAX request has completed.

  • 1
    That's awesome! How could I miss this! Worked perfectly. Thanks again @Keith – orangeguy May 19 '16 at 20:15
  • 2
    @Mr.Orange No problem. I only know about it because I've needed to re-apply jQuery after part of a page has been replaced by an AJAX request. – Keith C May 19 '16 at 20:17
  • I was sure this has nothing to do with the controller end, but something related to with JavaScipt library. Long way to go ahead! Again, admire your help though. – orangeguy May 19 '16 at 20:19

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.