We utilize DocuSign for electronic signature of our financial agreements.
We added the External Resource of /apex/dsfs__DocuSign_JavaScript.
We created an in-line snippet with the code below and created a button with the action of Run Skuid Snippet and related it to the created snippet.
Each time I select the button from the preview it throws an error that the ID is not set correctly “SourceID={{Financial__c.Id}}”
Has anyone successfully added a custom Send With DocuSign button to their Skuid page?
Any suggestions on how to properly merge fields into this code?
The snippet code is listed below.
//********* Option Declarations (Do not modify )// var RC = ‘’;var RSL=‘’;var RSRO=‘’;var RROS=‘’;var CCRM=‘’;var CCTM=‘’;var CCNM=‘’;var CRCL=‘’; var CRL=‘’;var OCO=‘’;var DST=‘’;var LA=‘’;var CEM=‘’;var CES=‘’;var STB=‘1’;var SSB=‘1’;var SES=‘’;var SEM=‘’;var SRS=‘’;var SCS =‘’;var RES=‘’;
////
var CEM=“This is the Email Body.”;
var CES='This is the Email Subject;
var DST = ‘FC718430-C654-49B9-A3CF-92ADC1BCAF28’;
var CRL = ‘FirstName~{{Financial__cForm_Signer_First_Name__c}};LastName~{{Financial__cForm_Signer_Last_Name__c}};Email~{{Financial__cForm_Signer_Email__c}};Role~Customer;RoutingOrder~1’;
// Page Callout (Do not modify) //
window.location.href =“/apex/dsfs__DocuSign_CreateEnvelope?DSEID=0&SourceID={{Financial__c.Id}}&RC=”+RC+“&RSL=”+RSL+“&RSRO=”+RSRO+“&RROS=”+RROS+“&CCRM=”+CCRM+“&CCTM=”+CCTM+“&CRCL=”+CRCL+“&CRL=”+CRL+“&OCO=”+OCO+“&DST=”+DST+“&CCNM=”+CCNM+“&LA=”+LA+“&CEM=”+CEM+“&CES=”+CES+“&SRS=”+SRS+“&STB=”+STB+“&SSB=”+SSB+“&SES=”+SES+“&SEM=”+SEM+“&SRS=”+SRS+“&SCS=”+SCS+“&RES=”+RES;
//***//
DocuSign Custom Button
+3
+9You can’t really use the {{VARIABLE}} syntax inside of a snippet, you have to get a reference to a specific row. Once you have a reference to the row, you can access the fields using row.API_Name__c. Your snippet should probably look more like this:
<br />var params = arguments[0],<br /> $ = skuid.$;<br />//********* Option Declarations (Do not modify )*********// var RC = '';var RSL='';var RSRO='';var RROS='';var CCRM='';var CCTM='';var CCNM='';var CRCL=''; var CRL='';var OCO='';var DST='';var LA='';var CEM='';var CES='';var STB='1';var SSB='1';var SES='';var SEM='';var SRS='';var SCS ='';var RES=''; <br />//*************************************************// <br />var CEM="This is the Email Body."; <br />var CES='This is the Email Subject; <br />var DST = 'FC718430-C654-49B9-A3CF-92ADC1BCAF28';<br />var row = params.row || params.model.getFirstRow();<br />var CRL = 'FirstName~' + row.Financial__cForm_Signer_First_Name__c + ';LastName~' + row.Financial__cForm_Signer_Last_Name__c + ';Email~' + row.Financial__cForm_Signer_Email__c + ';Role~Customer;RoutingOrder~1'; <br />//********* Page Callout (Do not modify) *********// <br />window.location.href ="/apex/dsfs__DocuSign_CreateEnvelope?DSEID=0&SourceID=" + row.Financial__c.Id + "&RC="+RC+"&RSL="+RSL+"&RSRO="+RSRO+"&RROS="+RROS+"&CCRM="+CCRM+"&CCTM="+CCTM+"&CRCL="+CRCL+"&CRL="+CRL+"&OCO="+OCO+"&DST="+DST+"&CCNM="+CCNM+"&LA="+LA+"&CEM="+CEM+"&CES="+CES+"&SRS="+SRS+"&STB="+STB+"&SSB="+SSB+"&SES="+SES+"&SEM="+SEM+"&SRS="+SRS+"&SCS="+SCS+"&RES="+RES;
Thanks so much Moshe! Good start…
I’m sorry I’m such a novice with this, but now that I have added this code to the snippet it does nothing on click. (No page load, no redirect)
The code:
var params = arguments[0],
$ = skuid.$;
//********* Option Declarations (Do not modify )//
var RC = ‘’;var RSL=‘’;var RSRO=‘’;var RROS=‘’;var CCRM=‘’;var CCTM=‘’;var CCNM=‘’;var CRCL=‘’; var CRL=‘’;var OCO=‘’;var DST=‘’;var LA=‘’;var CEM=‘’;var CES=‘’;var STB=‘1’;var SSB=‘1’;var SES=‘’;var SEM=‘’;var SRS=‘’;var SCS =‘’;var RES=‘’;
//*******************************//
var CEM=“This is the Email Body.”;
var CES=‘This is the Email Subject’;
var DST = ‘FC718430-C654-49B9-A3CF-92ADC1BCAF28’;
var row = params.row || params.model.getFirstRow();
var CRL = ‘FirstName~’ + row.Financial__c.Form_Signer_First_Name__c + ‘;LastName~’ + row.Financial__c.Form_Signer_Last_Name__c + ‘;Email~’ + row.Financial__cForm_Signer_Email__c + ‘;Role~Customer;RoutingOrder~1’;
// Page Callout (Do not modify) *********//
window.location.href =“/apex/dsfs__DocuSign_CreateEnvelope?DSEID=0&SourceID=” + row.Financial__c.Id + “&RC=”+RC+“&RSL=”+RSL+“&RSRO=”+RSRO+“&RROS=”+RROS+“&CCRM=”+CCRM+“&CCTM=”+CCTM+“&CRCL=”+CRCL+“&CRL=”+CRL+“&OCO=”+OCO+“&DST=”+DST+“&CCNM=”+CCNM+“&LA=”+LA+“&CEM=”+CEM+“&CES=”+CES+“&SRS=”+SRS+“&STB=”+STB+“&SSB=”+SSB+“&SES=”+SES+“&SEM=”+SEM+“&SRS=”+SRS+“&SCS=”+SCS+“&RES=”+RES;
+9OK that’s fine. The console will be your friend here… try Ctrl + Shift + J in chrome, see what errors you have in the Javascript console and paste them here.
Without any knowledge of you’re page or objects, I can only assume what field names are correct. I have a hunch that Financial__c should be replaced with Financial__r, so try this:
var params = arguments[0], <br>$ = skuid.$;<br>//********* Option Declarations (Do not modify )*********// <br>var RC = '';var RSL='';var RSRO='';var RROS='';var CCRM='';var CCTM='';var CCNM='';var CRCL=''; var CRL='';var OCO='';var DST='';var LA='';var CEM='';var CES='';var STB='1';var SSB='1';var SES='';var SEM='';var SRS='';var SCS ='';var RES=''; <br>//*************************************************// <br>var CEM="This is the Email Body."; <br>var CES='This is the Email Subject'; <br>var DST = 'FC718430-C654-49B9-A3CF-92ADC1BCAF28';<br>var row = params.row || params.model.getFirstRow();<br>var CRL = 'FirstName~' + row.Financial__r.Form_Signer_First_Name__c + ';LastName~' + row.Financial__r.Form_Signer_Last_Name__c + ';Email~' + row.Financial__r.Form_Signer_Email__c + ';Role~Customer;RoutingOrder~1'; <br>//********* Page Callout (Do not modify) *********// <br>window.location.href ="/apex/dsfs__DocuSign_CreateEnvelope?DSEID=0&SourceID=" + row.Financial__r.Id + "&RC="+RC+"&RSL="+RSL+"&RSRO="+RSRO+"&RROS="+RROS+"&CCRM="+CCRM+"&CCTM="+CCTM+"&CRCL="+CRCL+"&CRL="+CRL+"&OCO="+OCO+"&DST="+DST+"&CCNM="+CCNM+"&LA="+LA+"&CEM="+CEM+"&CES="+CES+"&SRS="+SRS+"&STB="+STB+"&SSB="+SSB+"&SES="+SES+"&SEM="+SEM+"&SRS="+SRS+"&SCS="+SCS+"&RES="+RES;
I changed the fields to “__r” and am getting this error: “Cannot read property ‘Form_Signer_First_Name__r’ of undefined”.
I receive this same error when the fields are “__c”.
The fields are correct (as this code is copied directly from the code used in production within the On Click JavaScript button).
This snippet is running on a record detail Skuid page. The button is a Financial custom record. The record loads appropriately, only error is on click of the button, and the error is only seen within the console.
Thanks again!
+9Try this :
var params = arguments[0], $ = skuid.$;
//********* Option Declarations (Do not modify )*********// <br />var RC = '';var RSL='';var RSRO='';var RROS='';var CCRM='';var CCTM='';var CCNM='';var CRCL=''; var CRL='';var OCO='';var DST='';var LA='';var CEM='';var CES='';var STB='1';var SSB='1';var SES='';var SEM='';var SRS='';var SCS ='';var RES=''; <br />//*************************************************// <br />var CEM="This is the Email Body."; <br />var CES='This is the Email Subject'; <br />var DST = 'FC718430-C654-49B9-A3CF-92ADC1BCAF28';<br />var row = params.row || params.model.getFirstRow(); //make sure you're getting a row!!! console.log(row);<br />var CRL = 'FirstName~' + row.Form_Signer_First_Name__c + ';LastName~' + row.Form_Signer_Last_Name__c + ';Email~' + row.Form_Signer_Email__c + ';Role~Customer;RoutingOrder~1'; <br />//********* Page Callout (Do not modify) *********// <br />window.location.href ="/apex/dsfs__DocuSign_CreateEnvelope?DSEID=0&SourceID=" + row.Id + "&RC="+RC+"&RSL="+RSL+"&RSRO="+RSRO+"&RROS="+RROS+"&CCRM="+CCRM+"&CCTM="+CCTM+"&CRCL="+CRCL+"&CRL="+CRL+"&OCO="+OCO+"&DST="+DST+"&CCNM="+CCNM+"&LA="+LA+"&CEM="+CEM+"&CES="+CES+"&SRS="+SRS+"&STB="+STB+"&SSB="+SSB+"&SES="+SES+"&SEM="+SEM+"&SRS="+SRS+"&SCS="+SCS+"&RES="+RES;
Moshe, that worked!
Thank you so much.
To recreate the “Send To DocuSign” custom button on a Skuid record detail page:
1. Add a JavaScript Item
1a. Resource Location = “External”
1b. Resource URL = “/apex/dsfs__DocuSign_JavaScript”
1c. Resource Name = “DocuSign_JavaScript”
2. Add a JavaScript Item
1a. Resource Location = “In-Line (Snippet)”
1b. Snippet Name = Send_With_DocuSign
1c. Snippet Body =
var params = arguments[0], $ = skuid.$;<br />//********* Option Declarations (Do not modify )*********// <br />var RC = '';var RSL='';var RSRO='';var RROS='';var CCRM='';var CCTM='';var CCNM='';var CRCL=''; var CRL='';var OCO='';var DST='';var LA='';var CEM='';var CES='';var STB='1';var SSB='1';var SES='';var SEM='';var SRS='';var SCS ='';var RES=''; <br />//*************************************************// <br />var CEM="This is the Email Body."; <br />var CES='This is the Email Subject'; <br />var DST = 'This is the DocuSign Template ID';<br />var row = params.row || params.model.getFirstRow();<br />// write row data to console<br />console.log(row);<br />var CRL = 'FirstName~' + row.FirstNameField + ';LastName~' + row.FirstNameField + ';Email~' + row.EmailField + ';Role~Customer;RoutingOrder~1'; //********* Page Callout (Do not modify) *********// window.location.href ="/apex/dsfs__DocuSign_CreateEnvelope?DSEID=0&SourceID=" + row.Id + "&RC="+RC+"&RSL="+RSL+"&RSRO="+RSRO+"&RROS="+RROS+"&CCRM="+CCRM+"&CCTM="+CCTM+"&CRCL="+CRCL+"&CRL="+CRL+"&OCO="+OCO+"&DST="+DST+"&CCNM="+CCNM+"&LA="+LA+"&CEM="+CEM+"&CES="+CES+"&SRS="+SRS+"&STB="+STB+"&SSB="+SSB+"&SES="+SES+"&SEM="+SEM+"&SRS="+SRS+"&SCS="+SCS+"&RES="+RES;
3. Create Custom Button
3a. Action Type = “Custom: Run Skuid Snippet”
3b. Snippet Name = “Send_With_DocuSign”
+7@Chad - first - thanks so much for the detailed walk through once you got it working.
I got this working but ran into issues with adding/removing people. When I try to add someone, I can click Add Signer but the window stays up and has a "Error: " in the background without any details.
While on the phone with the DS support rep, we tried working with the button but can’t figure out how to modify it to work correctly.
The current workaround is to remove all signers and then start adding the people again - that seems to work fine. My guess is it has something to do with the “CRL” or “row”.
Thoughts?
+7Sure - your default code ended up passing through someone named “undefined undefined” so I commented out line 11 with the var CRL
var params = arguments[0], $ = skuid.$; //********* Option Declarations (Do not modify )*********// var RC = '';var RSL='';var RSRO='';var RROS='';var CCRM='';var CCTM='';var CCNM='';var CRCL=''; var CRL='';var OCO='';var DST='';var LA='';var CEM='';var CES='';var STB='1';var SSB='1';var SES='';var SEM='';var SRS='';var SCS ='';var RES=''; //*************************************************// var CEM="This is the Email Body."; var CES='This is the Email Subject'; var DST = 'This is the DocuSign Template ID'; var row = params.row || params.model.getFirstRow(); // write row data to console console.log(row); // var CRL = 'FirstName~' + row.FirstNameField + ';LastName~' + row.FirstNameField + ';Email~' + row.EmailField + ';Role~Customer;RoutingOrder~1'; //********* Page Callout (Do not modify) *********// window.location.href ="/apex/dsfs__DocuSign_CreateEnvelope?DSEID=0&SourceID=" + row.Id + "&RC="+RC+"&RSL="+RSL+"&RSRO="+RSRO+"&RROS="+RROS+"&CCRM="+CCRM+"&CCTM="+CCTM+"&CRCL="+CRCL+"&CRL="+CRL+"&OCO="+OCO+"&DST="+DST+"&CCNM="+CCNM+"&LA="+LA+"&CEM="+CEM+"&CES="+CES+"&SRS="+SRS+"&STB="+STB+"&SSB="+SSB+"&SES="+SES+"&SEM="+SEM+"&SRS="+SRS+"&SCS="+SCS+"&RES="+RES;<br>
There’s the problem.
Line 11 is where all of the magic happens. For the code to work you will need to replace FirstNameField with your own Salesforce field for the first name of the contact you are wanting to send to, in our instance it is row.Contract_Signer_FirstName__c. Contract Signer First Name is a custom formula field we created to produce the first name.
You will need to create the fields and add them to the code for:
FirstNameField
LastNameField
EmailField
So, if you create 3 formulas fields with the name Signer First Name, Signer Last Name, and Signer Email line 11 should be:
var CRL = 'FirstName~' + row.SignerFirstName__c + ';LastName~' + row.SignerLastName__c + ';Email~' + row.SignerEmail__c + ';Role~Customer;RoutingOrder~1';
Ah ok. So if I want to pull the Contact Roles through, I’d use the standard merge syntax?
Or have you created fields on the Opp?
Only pulling the first Contact Role?
+3We ran into some issues when trying to use the standard fields, which is why we decided to use custom formulas.
The fields are on the opp and are tied to a lookup on the opp, not in anyway tied to the contact role.
+7Skuid team - how would you leverage this solution while using data from a related model? In this case, it’s the Contact Role on the Opportunity. I have all of the data I would need - first/last name and email - but can’t get that data to flow into the solution here.
+17- Nintex Employee
Instead of using the arguments provided to the snippet to get the row and field values, you can use the model API to get data from your related model. Something like this:
- // Get model
- var contactRoleModel = skuid.model.getModel(‘ContactRoleModel’);
- // Get the first row of the model,
- // which is probably an existing row from the database
- var firstContact = contactRoleModel.getFirstRow();
- // Get the name value
- var firstContactFirstName = firstContact.FirstName
+7That makes sense logically.
Here’s the updated button code:
var params = arguments[0], $ = skuid.$;
// Get model var contactRoleModel = skuid.model.getModel('OpportunityRoles'); // Get the first row of the model which is probably an existing row from the database var firstContact = contactRoleModel.getFirstRow(); // Get the name value var firstContactFirstName = firstContact.FirstName var firstContactLastName = firstContact.LastName var firstContactEmail = firstContact.Email //\*\*\*\*\*\*\*\*\* Option Declarations (Do not modify )\*\*\*\*\*\*\*\*\*// var RC = '';var RSL='';var RSRO='';var RROS='';var CCRM='';var CCTM='';var CCNM='';var CRCL=''; var CRL='';var OCO='';var DST='';var LA='';var CEM='';var CES='';var STB='1';var SSB='1';var SES='';var SEM='';var SRS='';var SCS ='';var RES=''; //\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*// var CEM="This is the Email Body."; var CES='This is the Email Subject'; var DST = 'This is the DocuSign Template ID'; var row = params.row || params.model.getFirstRow(); // write row data to console console.log(row); var CRL = 'FirstName~' + firstContactFirstName + ';LastName~' + firstContactLastName + ';Email~' + firstContactEmail + ';Role~Customer;RoutingOrder~1'; //\*\*\*\*\*\*\*\*\* Page Callout (Do not modify) \*\*\*\*\*\*\*\*\*// window.location.href ="/apex/dsfs\_\_DocuSign\_CreateEnvelope?DSEID=0&SourceID=" + row.Id + "&RC="+RC+"&RSL="+RSL+"&RSRO="+RSRO+"&RROS="+RROS+"&CCRM="+CCRM+"&CCTM="+CCTM+"&CRCL="+CRCL+"&CRL="+CRL+"&OCO="+OCO+"&DST="+DST+"&CCNM="+CCNM+"&LA="+LA+"&CEM="+CEM+"&CES="+CES+"&SRS="+SRS+"&STB="+STB+"&SSB="+SSB+"&SES="+SES+"&SEM="+SEM+"&SRS="+SRS+"&SCS="+SCS+"&RES="+RES;
But when I click the button, I get “undefined” for those fields.
+6- Nintex Employee
Are those fields included in your Model? If they aren’t queried, then they won’t have values.
+7@JD - yes, they’re included but I’m not sure how to get them into the snippet to work. The default code above passes through the primary contact role but I get errors when trying to add any others to sign. I would have to delete that person and then I’m able to add new signers no problem.
@Ben - the beauty of Skuid is I’m not technical and can build awesome pages! Can you expand on how to do what you’re describing so I can get that answer for you?
Thanks, guys.
I’m almost being forced to not give my reps the efficiency of having people automatically added as signers to get this launched.
+17- Nintex Employee
Joe. Please give your reps efficiency!
What Ben means is the following:
Below this line of code:
var firstContact = contactRoleModel.getFirstRow();
Add the following line of code:
console.log (‘First Contact Value’, firstContact);
This will output the value of that that variable to the browser console. If nothing is there, then you can work back up to see why the opportunity roles model isn’t getting loaded. If it is there you can inspect it to see whether there are rows with the data you expect.
Javascript debugging. Fun for all ages.
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.