function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Francesco SciutoFrancesco Sciuto 

Execution of Javascript inside a Custom Button is deferred till the end of function

We display inside a tab in the Sales Console a custom object page layout with a custom Javascript button. Once the user clicks on that button, the custom code performs some operations on a Salesforce custom web service APEX class (by using the script connection.js) and based on the response, eventually opens a new tab in the console (by using the script integration.js). This functionality works fine.

When the system is busy working, not to let the user press the button twice or getting confused about the state of his request, we want to disable the button and display the waiting cursor. So we created the following code inside the button:

 
var btnService = document.getElementsByName("check_lead_contact");

btnService[0].value='Checking, please wait...';
btnService[0].disabled=true;
document.body.style.cursor = 'wait';

//JavaScript code calling APEX Webservice by using connection.js
//Javascript code opening new Sales Consoel tab using integration.js

document.body.style.cursor = 'default';
btnService[0].value='Check Lead/Contact';
btnService[0].disabled=false;

However this code does not work, the button does not get disabled and the cursor does not change to "wait". However, if I inspect the code with developer tools, I see that in the console the state of the JS variables linked to both the button and the cursor change but such changes are not reflected in the UI. All the changes in the UI are made once the function ends and not the state variable change, as it is supposed to be, most likely because the call to the webservice somehow make the function hangs.  
 
We asked help to SF support that replied to us that they do not offer support for buttons containing references to either connection.js or integration.js, although they are included in official SF documentation. Does anybody know a way to solve this issue?
LBKLBK
Is your web service call Synchronous or Asynchronous?

If you are making an asynchronous call to your Web service, it will call the function once and move forward and execute lines 10, 11 and 12 (will not wait for the execution of the web service).

You may have to follow one of the following two ways.

1. Make the web service call Synchronous.

2. Move the lines 10, 11 and 12 to the Callback of the Web Service.
Francesco SciutoFrancesco Sciuto
Hello LBK,

thanks for your reply. In order to consume the webservice I use the function sforce.apex.execute(className, methodName, parameters) and I am quite sure it is synchronous. 
LBKLBK
Can you put an alert before line 10 to check if the cursor change stays in the screen?

 
LBKLBK
Hi Francesco,

This may be a long shot again.

But What I have figured out is that getElementsByName may not yield the results you expect.
var btnService = document.getElementsByName("check_lead_contact");
Can you instead use code similar to below?
var btnService = document.getElementById('j_id0:j_id2:j_id3:j_id4:j_id7:check_lead_contact');
You can get the exact id of your button using the "Inspect Element" feature of your browser.


 
LBKLBK
Your final code will look like this.
 
var btnService = document.getElementById('j_id0:j_id2:j_id3:j_id4:j_id7:check_lead_contact');
btnService.value='Checking, please wait...';
btnService.disabled=true;
document.body.style.cursor = 'wait';

//JavaScript code calling APEX Webservice by using connection.js
//Javascript code opening new Sales Consoel tab using integration.js

document.body.style.cursor = 'default';
btnService.value='Check Lead/Contact';
btnService.disabled=false;