+ Start a Discussion
ethan huntethan hunt 

Progress bar?



Could you please help me in implementing a progress bar on a VF page.

I have a button which implements add functionality. I need some progress image kind of thing will appear when i click the button.


For Example - when we place a cursor on any field in recent items (Homepage) . A circle kind of loading appers.




I have read some where : - 

<div id="StatusCheck" class="thickbox_popup"> <apex:outputText value="Please Wait..." style="font-size:17px;color: #ffffff;font-weight: bold"></apex:outputText> <apex:image url="{!CSSURL}themes/default/loading_bar.gif" alt="Please Wait ..."/> </div> <apex:actionStatus onstart="showStatus();" onstop="closeStatus();" id="myRecSav" ></apex:actionStatus>

Hi Siddhartha,


For displaying operation in progress, you can use tags like <apex:actionStatus> & <apex:facet>.

You can refer to following code which uses actionStatus.


<!-- Page: -->
<apex:page controller="exampleCon">
<apex:outputText value="Watch this counter: {!count}" id="counter"/>
<apex:actionStatus startText=" (incrementing...)"
stopText=" (done)" id="counterStatus"/>
<apex:actionPoller action="{!incrementCounter}" rerender="counter"
status="counterStatus" interval="15"/>


/*** Controller: ***/
public class exampleCon {
Integer count = 0;
public PageReference incrementCounter() {

return null;
public Integer getCount() {
return count;


Similarly, you can refer to Visualforce developer's guide.



Sachin Sankad.