Using a JavaScript - Button as an Advanced Conditional Button

There may be times where it is easier for either the agent or script editor to have a single button to click that fulfils a multitude of functions depending on context. The Conditional Button is frequently sufficient for the task, but there are times when more complex usage is desired; in these instances, the JavaScript - Button can be used. A usage case may be where a field needs to be compulsory in some cases, but optional in others.
 

Scenario

A single button needs to be displayed at the bottom of the page, and offer differing validation and destination based upon the page state. It will also need to provide feedback to the agent or interact with other controls in some situations.
 
 

Considerations

There are three different choices for how the JavaScript - Button could trigger the page transition when it has completed:
  1. Have a hidden Conditional Button that the JavaScript - Button "clicks" at the appropriate time, which controls where the destination page is. This can simplify the code within the JavaScript - Button in some instances, but also obscures the destination page and introduces a need to edit code in two locations to ensure that the conditions are aligned.
  2. Have a set of hidden Buttons that the JavaScript - Button "clicks" at the appropriate time. As each Button is linked to a single page, as long as it is named in a clear and descriptive manner then this sidesteps the issue of the obscuring the destination without the need to worry about ensuring that conditions match between two locations. However, it does mean that there can be many buttons placed on a page that each need configuring and hiding, which is less than ideal.
  3. Make use of the Script.Utils.Navigate() helper function to directly trigger page navigation with JavaScript. This makes use of the desired destination page name and requires no other buttons to be placed upon the page, so destination clarity is achieved and page clutter is avoided. However, if a page is renamed then care needs to be taken to ensure all instances of Script.Utils.Navigate() that refer to that page are updated, and the Check Script functionality doesn't detect the links made with Script.Utils.Navigate() and so may display warnings about pages not being linked.
The first two methods can be appropriate in many instances, but in this example we'll make use of the third method.
 
 

Implementation

First, place the JavaScript - Button on the page and style it as desired. The following code would then be entered, and the Run Calculations option enabled:
if ([Call Purpose] == "General Enquiry") {
    // For general enquiries we only require the caller's name - but we'll accept any further details such as their company if offered
    if ([Name] != "") {
        Scripts.Utils.Navigate("03 General Enquiry");
    }
    else {
        alert("Please ensure the caller's name is set");
    }
}
else if ([Call Purpose] == "Sales Enquiry") {
    // For sales enquiries we also want to know the caller's company and telephone, so we also treat it as mandatory
    if (([Name] != "") && ([Company] != "") && ([Telephone] != "")) {
        Scripts.Utils.Navigate("04 Sales Enquiry");
    }
    else {
        alert("Please ensure the caller's name, company, and telephone are set");
    }
}
else if ([Call Purpose] == "Support Request") {
    // This script pushes the basic details collected on this page to a CRM in cases of a support request
    // When the agent clicks the JavaScript - Button, it clicks an External Data Source control to insert the record to the CRM, and displays a loading label...
    if ([CRM Insert] == "") {
        Script.Utils.GetCSObject([CRM Insert]).click();
        Script.Fields.Show("[Inserting Entry Label]");
    }
    // ...and when the External Data Source is complete, it clicks the JavaScript - Button again using an Update Link
    else {
        Script.Utils.Navigate("99 Wrap");
    }
}
else if ([Call Purpose] == "Hoax/Hangup") {
    Script.Utils.Navigate("99 Wrap");
else {
    //When the Call Purpose isn't set, produce an alert rather than just reloading the same page or doing nothing
    alert("Please select a call purpose");
}