Business Scenario

Solution

1. Helen creates a form and adds different Currency fields to record all the expenses incurred and to declare the Budget .
   
2. The sum of all expenses is calculated using client script and stored in a new Currency field, say Total Cost .
   
3. The fixed Budget amount can be validated against the Total Cost using client scripts. If the Total Cost exceeds the Budget, an error message will be displayed and the user is not allowed to submit the PO. If the Total Cost is well within the Budget, the PO is submitted and sent for approval.
   

Sample Configuration   

Step 1: Create an orchestration

1. Add Currency fields to record different expenses like Item cost, Tax, and Freight charges.
   
2. Create a Currency field to calculate and display the Total cost.
   
3. Create another Currency field to declare the Budget. Here, we’ve set $1000 as the default budget value. 
   

Step 2: Code client scripts

Script 1: Purchase order cost calculation

1. Create a new script and enter a name—Purchase order cost calculation.
   
2. Choose Purchase Order Orchestration  in the Form  dropdown.
   
3. Choose Add new card  as the Execution Location to execute the script when a new card is added.
   
4. Choose onChange as the Execution Trigger to calculate the total cost whenever the expense values are changed. On selecting this option, a Fields dropdown will be displayed in the right panel, where you can choose the fields whose update must trigger the script.
   
5. Copy paste the below script into your script editor and replace the parameter names.
   
1. You can use the ? Icon at the top-right corner of the script editor to refer to parameter names.
   
6. Once the script is ready, Publish it.
   

Sample Script

async function onChange(forpage,oldVal,newVal,executeOnLoad){

    if(executeOnLoad){

        return;

    }

    var item_cost = current.Job.getValue(current.Layout.Fields.<select-Item-cost-parameter-here>.id);

    var tax = current.Job.getValue(current.Layout.Fields.<select-Tax-parameter-here>.id);

    var freight = current.Job.getValue(current.Layout.Fields.<select-Freight-charges-parameter-here>.id);

    var total = item_cost.value + tax.value + freight.value;

    current.Job.setValue(current.Layout.Fields.<select-Total-cost-parameter-here>.id, total);

} 

Note

1. You can either choose Add new card  or Card details or both as the Execution
   
   Location based on where you want the validation to be performed.
   
2. Also, you can either choose onChange or onSubmit as the Execution Trigger .
   
1. Selecting onChange will enable the script to calculate the total cost whenever the expense values are changed.
   
2. Selecting onSubmit will allow the script to calculate the total cost when the card is submitted or saved. 
   

Script 2: Purchase order budget validation

1. Create a new script and enter a name—Purchase order budget validation.
   
2. Choose Purchase Order Orchestration  in the Form  dropdown.
   
3. Choose Add new card  as the Execution Location to execute the script when a new card is added.
   
4. Choose onSubmit as the Execution Trigger to enable the script to validate the total cost against the budget whenever the new card is submitted by clicking the Save button.
   
5. Copy paste the below script into your script editor and replace the parameter names.
   
1. You can use the ? Icon at the top-right corner of the script editor to refer to parameter names.
   
6. Once the script is ready, Publish it. 
   

Sample Script

async function onSubmit(forpage) {

    var total = current.Job.getValue(current.Layout.Fields.<select-Total-cost-parameter-here>.id);

    var budget = current.Job.getValue(current.Layout.Fields.<select-Budget-parameter-here>.id);

    if (total.value > budget.value) {

        ZDK.Message.Inline(current.Layout.Fields.<select-Total-cost-parameter-here>.id, "Total cost exceeds the Budget");

        return false;

    }

  return true;

}

Note

1. You can either choose Add new card  or Card details or both as the Execution Location based on where you want the validation to be performed.
   
2. Also, you can either choose onChange or onSubmit as the Execution Trigger .
   
1. Selecting onChange will enable the script to validate the budget whenever the expense values or total cost is changed.
   
2. Selecting onSubmit will allow the script to validate the budget when the card is submitted or saved. 
   

Step 3: Add card

1. Navigate to Cards and click Add Card .
   
2. Select Purchase Order Orchestration  from the Form dropdown.
   
3. Enter the card details and expenses incurred.
   
1. Total cost gets calculated automatically.
   
2. If the total cost is higher than the budget, an error message is displayed.