Archives

Salesforce: Do not use status animation on both commandButton and actionFunction in VisualForce

April 15, 2015

Everyone who has ever developed a VisualForce page knows that actionFunction, which is called from page and performs controller method, takes some time to be processed on backend, and as a rule we want to prevent users from any actions during controller action method being executed.

Usually, we use status parameter of commandButton and actionFunction. Lets assume we have some page like this

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<apex:page controller="testC">
<apex:form >
<apex:actionFunction action="{!controllerAction1}" name="actionJavaScriptFunction1"  status="statusAnim" />
<apex:commandButton value="Action 1" onclick="javascriptFunction();" status="statusAnim"/>
</apex:form>
<script type="text/javascript">
function javascriptFunction() {
if ( confirm( 'Do you really want to hurt me?\r\nDo you really want to make me cry?' ) ) {
actionJavaScriptFunction1();
}
}
</script>
</apex:page>

with a controller like this

1
2
3
4
5
public class testC {
public PageReference controllerAction1() {
return null;
}
}

Then imagine that we have actually created some status animation which shows image from static resources

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<style>
DIV#grayArea {
width: 100%;
height: 100%;
position: absolute;
z-index: 10;
padding: 0 0 0 0;
margin: 0 0 0 -10px;
display: none;
}
DIV#grayAreaInside{
width: 100%;
height: 100%;
background-color: #39C;
position: absolute;
z-index: 11;
opacity: 0.5;
padding: 400px 0 0 0;
margin: -359px 0 0 0;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);
}
</style>
<div id="grayArea" class="grayArea">
<div id="grayAreaInside" class="grayAreaInside"></div>
<div align="center">
<img alt="Loading..." src="{!$Resource.Load}" id="loadingImage"/>
<br/>
<img src="{!$Resource.loader}" id="loadingImage"/>
</div>
</div>
<apex:actionStatus id="statusAnim" onstart="jQuery('div#grayArea').css('display','block');" onstop="jQuery('div#grayArea').css('display','none');" />

and have some logic in the controller, and it happens that this animation is stopped before we actually want to stop it. The reason is that we used it twice, once in commandButton and second time in actionFunction.

So, if we simply remove it from the commandButton everything would work just fine and everyone will be happy because animation won’t be stopped before all the logic has been performed completely.

Cheers.

Tags



Share


0 replies

Leave a Reply

Want to join the discussion?
Feel free to contribute!

Leave a Reply

Your email address will not be published. Required fields are marked *

Recent Articles

9 Big Things about Java 9

September 15, 2017 | Andrew Petryk

According to the latest Tiobe index of programming language popularity, Java tops the list.  No wonder there is so much buzz around the new Java 9 release, set for September 21, 2017.  Take a walk through with our expert.     1. JSHELL Many compiled languages include tools for statements interpretation. By using these REPL tools […]

What are your customers telling you? Maximize the effectiveness of sentiment analysis by using simple tips

September 7, 2017 | Lily Smirnova

Sentiment analysis is one method to gather and process customer-supplied information, and then convert it to a quality customer experience. Gartner predicts that 85% of all businesses will compete in the area of customer experience by 2020. As sentiment analysis explodes onto the scene, what can technology actually do to enhance business efforts? Hints on […]