Js Code To Perform A Calculation When A Dropdown Is Selected

[seancsn]

Hi,

I would like some help writing a JS code to calculate an item in submission form. For simplicity I have renamed the relevant items in my app:

 

Form name: Actions_made

 

Relevant fields:

1. "Actions" - dropdown with a number of options eg. Cancelled, Switched etc.

2. "Current Product name" - dropdown with product names that user currently uses

3. "Current Pack cost" - cascading text field that populates with the relevant pack cost once the Product above has been chosen

4. "Current Pack size" - cascading text field that populates with the relevant pack size once the Product above has been chosen

5. "Quantity per day" - populated with a default value of one but user can update with any quantity.

6. "Annual Saving of Current product" - needs to populate with the formula when "Cancelled" is selected from the dropdown "Actions"  above and also if the "Quantity per day" field remains as one or is updated by the user:

(Current Pack cost/Current Pack size)*Quantity per day*365

 

I have never written JS code before and would like some help to be pointed in the right direction.

Thank you in advance and have a great Christmas!

 

Sean

[Aurora]

Hi seancsn. 

 

How many options do you have in " Action" dropdown?

 

 

Aurora

[seancsn]

6 different options. One of them being "Cancelled".

Thanks

 

Sean

[Xiang]

Hello Sean,

 

How are you?

 

I think, you can use the following code:

<script>
function calculate(){
var selection = document.getElementsByName("InsertRecorddropdown")[0].value;

var one = parseFloat(document.getElementById("InsertRecordone").value);
var two = parseFloat(document.getElementById("InsertRecordtwo").value);
var three = parseFloat(document.getElementById("InsertRecordthree").value);
var four = parseFloat(document.getElementById("InsertRecordfour").value);
var five = parseFloat(document.getElementById("InsertRecordfive").value);
var six = parseFloat(document.getElementById("InsertRecordsix").value);
var result = 0;

switch(selection) {
    case "first":
        result = one * two;        
        break;
    case "second":
        result = three + four;        
        break;
    case "third":
        result = five * six + one;        
        break;
    default:
        result = one + two + three + four + five + six;        
}
document.getElementById("InsertRecordresult").value = result;
}
document.getElementsByName("InsertRecorddropdown")[0].onchange=calculate;

</script>

Please change names of fields (dropdown, one, result etc) and variants of selection (first, second, third). You can write more than one line of code after case "variant" and before "break;"

 

Please feel free to ask.

 

 

Happy New Year!

[seancsn]

Thank you Xiang. That is really helpful. I hadnt seen the Switch option but had been advised to use else and if. Yours looks much simpler!

[Kurumi]

Hi @seancsn

As of July 12, 2018, Caspio introduced new features which you can find here: https://howto.caspio.com/release-notes/caspio-bridge-13-0/

This release includes a new feature, Calculated Values in Submission Forms.  This allows you to generate calculations which you can use to calculate your fields automatically.

Check these videos for more information:

 

I hope it helps!