Before you guys shoot me down for not trying the code, I am very new to Javascript and I need to implement this function into a very important work.
I got the basis dropdown calculation from this thread, Javascript drop-down form math calculation. I modified the code referred from the thread for my codes
Forgive me if my codes is totally wrong, I am still trying to do piece by piece. Will be grateful if you all can help me pinpoint the errors and/or issues.
So back to topic, I want to get the cost for each items, and then count the total cost to be calculated. The JSFiddle link is here. Appreciate for your helps rendered.
HTML CODES
<form name="priceCalc" action="">Laundry (Gentlemen)
<br/>Apparels:
<select name="gapparell" onchange="gentlemanl();">
<option value="5.00">Tie</option>
<option value="7.50">Shirt</option>
<option value="12.50">Jacket</option>
</select>
<br>Quantity:
<input type="text" id="gqtyl" onchange="gentlemanl();" />
<br>
<br/>Dry Cleaning (Gentlemen)
<br/>Apparels:
<select name="gappareld" onchange="gentlemand();">
<option value="6.00">Tie</option>
<option value="8.50">Shirt</option>
<option value="13.50">Jacket</option>
</select>
<br>Quantity:
<input type="text" id="gqtyd" onchange="gentlemand();" />
<br/><br/><br/>Laundry (Ladies)
<br/>Apparels:
<select name="lapparell" onchange="ladiesl();">
<option value="5.00">Tie</option>
<option value="7.50">Shirt</option>
<option value="12.50">Jacket</option>
</select>
<br>Quantity:
<input type="text" id="lqtyl" onchange="ladiesl();" />
<br>
<br/>Dry Cleaning (Ladies)
<br/>Apparels:
<select name="lappareld" onchange="ladiesd();">
<option value="6.00">Tie</option>
<option value="8.50">Shirt</option>
<option value="13.50">Jacket</option>
</select>
<br>Quantity:
<input type="text" id="lqtyd" onchange="ladiesd();" />
<br>Total Cost:
<input type="text" id="prices">
<br/>
<input type="button" value="Figure out pricing!" onclick="total();">
<br>
JAVASCRIPT CODES
function gentlemanl() {
var Amt = document.priceCalc.gapparell;
var Qty = document.priceCalc.gqtyl;
var price = parseInt(Qty.value) * parseFloat(Amt.value);
document.getElementById("prices").value = price;
}
function gentlemand() {
var Amt = document.priceCalc.gappareld;
var Qty = document.priceCalc.gqtyd;
var price = parseInt(Qty.value) * parseFloat(Amt.value);
document.getElementById("prices").value = price;
}
function ladiesl() {
var Amt = document.priceCalc.lapparell;
var Qty = document.priceCalc.lqtyl;
var price = parseInt(Qty.value) * parseFloat(Amt.value);
document.getElementById("prices").value = price;
}
function ladiesd() {
var Amt = document.priceCalc.lappareld;
var Qty = document.priceCalc.lqtyd;
var price = parseInt(Qty.value) * parseFloat(Amt.value);
document.getElementById("prices").value = price;
}
function total() {
//I am not sure how the function works
}
this is a working exemple of what i think you want to do : http://jsfiddle.net/gd12k4mt/5/
function gentleman1() {
var Amt = document.priceCalc.gapparell;
var Qty = document.priceCalc.gqtyl;
return parseInt(Qty.value) * parseFloat(Amt.value);
}
I designed the functions like that. With a return statement for the value of each product * the quantity.
function total() {
if(isNaN(gentleman1())) {
gentleman_laundry = 0;
} else {
gentleman_laundry = gentleman1();
}
if(isNaN(gentlemand())) {
gentleman_dry = 0;
} else {
gentleman_dry = gentlemand();
}
if(isNaN(ladies1())) {
ladies_laundry = 0;
} else {
ladies_laundry = ladies1();
}
if(isNaN(ladiesd())){
ladies_dry = 0;
} else {
ladies_dry = ladiesd();
}
var totalPrice = gentleman_laundry+gentleman_dry+ladies_laundry+ladies_dry;
document.getElementById('prices').value = totalPrice;
}
The total function is like that with a test on empty fields. In this purpose I created the variables :
var gentleman_laundry,
gentlemend_dry,
ladies_laundry,
ladies_dry;
Be sure that your functions's name is good : here you have two different names in you're html events and in your script.
I personally did without theses html listeners because we want the total price at the end I guess. So I declared only one listener on the final button.
document.getElementById('submit_button').addEventListener('click', function(){
total();
})
Hope this helped.
You can try like this,
HTML
<form name="priceCalc" action="">Laundry (Gentlemen)
<br/>Apparels:
<select id="gapparell" />
<option value="5.00">Tie</option>
<option value="7.50">Shirt</option>
<option value="12.50">Jacket</option>
</select>
<br>Quantity:
<input type="text" id="gqtyl" />
<br>
<br/>Dry Cleaning (Gentlemen)
<br/>Apparels:
<select id="gappareld">
<option value="6.00">Tie</option>
<option value="8.50">Shirt</option>
<option value="13.50">Jacket</option>
</select>
<br>Quantity:
<input type="text" id="gqtyd" />
<br/>
<br/>
<br/>Laundry (Ladies)
<br/>Apparels:
<select id="lapparell" >
<option value="5.00">Tie</option>
<option value="7.50">Shirt</option>
<option value="12.50">Jacket</option>
</select>
<br>Quantity:
<input type="text" id="lqtyl"/>
<br>
<br/>Dry Cleaning (Ladies)
<br/>Apparels:
<select id="lappareld" onchange="ladiesd();">
<option value="6.00">Tie</option>
<option value="8.50">Shirt</option>
<option value="13.50">Jacket</option>
</select>
<br>Quantity:
<input type="text" id="lqtyd" onchange="ladiesd();" />
<br>Total Cost:
<input type="text" id="prices">
<br/>
<input type="button" value="Figure out pricing!" onclick="total()">
<br>
</form>
This is JS,
function gentleman1() {
var price=0;
var e = document.getElementById('gapparell')
var Amt = e.options[e.selectedIndex].value;
var Qty = document.getElementById('gqtyl').value;
price = parseInt(Qty) * parseFloat(Amt);
return (isNaN(price)) ? 0 : price;
//document.getElementById("prices").value = price;
}
function gentlemand() {
var price=0;
var e = document.getElementById('gappareld')
var Amt = e.options[e.selectedIndex].value;
var Qty = document.getElementById('gqtyd').value;
price = parseInt(Qty) * parseFloat(Amt);
return (isNaN(price)) ? 0 : price;
}
function ladies1() {
var price=0;
var e = document.getElementById('lapparell')
var Amt = e.options[e.selectedIndex].value;
var Qty = document.getElementById('lqtyl').value;
price = parseInt(Qty) * parseFloat(Amt);
return (isNaN(price)) ? 0 : price;
}
function ladiesd() {
var price=0;
var e = document.getElementById('lappareld')
var Amt = e.options[e.selectedIndex].value;
var Qty = document.getElementById('lqtyd').value;
price = parseInt(Qty) * parseFloat(Amt);
return (isNaN(price)) ? 0 : price;
}
function total() {
var price=gentleman1()+gentlemand()+ladiesd()+ladiesd();
document.getElementById('prices').value=price;
}
Working Demo
Related
I'm new to HTML and JavaScript. I need to do a website where it requires to sum up the Total value based on the select options. After that, pass the value back to the input in HTML.
HTML code
<select class="normalinput" name="giftname" id="giftname" onchange="populate('giftname')">
<option value="None">None</option>
<option value="G0001">Big Graduation Bear +RM60.00</option>
<option value="G0002">Small Graduation Bear +RM20.00</option>
<option value="G0003">Handcraft Gift Card +RM5.00</option>
<option value="G0004">Valentine Gift Card +RM10.00</option>
<option value="G0005">Godiva Chocolate Box +RM100.00</option>
<option value="G0006">Ferrero Rocher Love Box +RM90.00</option>
</select>
<p class="total"> Total: RM <input type="number" name="total" id="total"></p>
JavaScript Code
<script type="text/javascript">
function populate(giftname) {
var giftname = document.getElementById(giftname);
var gg = giftname.options[giftname.selectedIndex].value;
var total;
if (gg.value == "G0001") {
total = 90 + 60;
document.getElementById("total").value = total;
}
else if (gg.value == "G0002") {
total = 90 + 20;
document.getElementById("total").value = total;
}
else if (gg.value == "G0003") {
total = 90 + 5;
document.getElementById("total").value = total;
}
else if (gg.value == "G0004") {
total = 90 + 10;
document.getElementById("total").value = total;
}
else if (gg.value == "G0005") {
total = 90 + 100;
document.getElementById("total").value = total;
}
else if (gg.value == "G0006") {
total = 90 + 90;
document.getElementById("total").value = total;
}
else
total = 90;
document.getElementById("total").value = total;
}
</script>
A screenshot of result needed
Thank you so much.
You can add a data attribute to your HTML option elements to contain the price and use it to compute your total price.
<select class="normalinput" name="giftname" id="giftname" onchange="populate('giftname')">
<option data-price="0" value="None">None</option>
<option data-price="60" value="G0001">Big Graduation Bear +RM60.00</option>
<option data-price="20" value="G0002">Small Graduation Bear +RM20.00</option>
<option data-price="5" value="G0003">Handcraft Gift Card +RM5.00</option>
<option data-price="10" value="G0004">Valentine Gift Card +RM10.00</option>
<option data-price="100" value="G0005">Godiva Chocolate Box +RM100.00</option>
<option data-price="90" value="G0006">Ferrero Rocher Love Box +RM90.00</option>
</select>
<p class="total"> Total: RM <input type="number" name="total" id="total"></p>
<script type="text/javascript">
populate('giftname');
function populate(giftnameId) {
var giftnameSelect = document.getElementById(giftnameId); // Select dropdown
let selectedOption = giftnameSelect.options[giftnameSelect.selectedIndex]; // Selected option
// Get the selected value. We need the plus to parse it to a number, because initially its a string.
var selectedGiftnameValue = +selectedOption.dataset.price;
var total = 90 + selectedGiftnameValue;
document.getElementById("total").value = total;
}
</script>
You can try a more simple approach.
Assuming you want a dollar value I added
return total.value = Number.parseFloat(price).toFixed(2);
if not replace the above line with
total.value = price;
var price;
var total = document.getElementById('total');
var gg = document.getElementById('giftname');
gg.onchange = function() {
if (gg.value == "G0001") {
price = 90 + 60;
}
else if (gg.value == "G0002") {
price = 90 + 20;
}
else if (gg.value == "G0003") {
price = 90 + 5;
}
else if (gg.value == "G0004") {
total = 90 + 10;
}
else if (gg.value == "G0005") {
price = 90 + 100;
}
else if (gg.value == "G0006") {
price = 90 + 90;
}
else {
price = 90;
}
return total.value = Number.parseFloat(price).toFixed(2);
}
<select class="normalinput" name="giftname" id="giftname" \>
<option value="None">None</option>
<option value="G0001">Big Graduation Bear +RM60.00</option>
<option value="G0002">Small Graduation Bear +RM20.00</option>
<option value="G0003">Handcraft Gift Card +RM5.00</option>
<option value="G0004">Valentine Gift Card +RM10.00</option>
<option value="G0005">Godiva Chocolate Box +RM100.00</option>
<option value="G0006">Ferrero Rocher Love Box +RM90.00</option>
</select>
<p class="total"> Total: RM <input type="number" name="total" id="total" ></p>
just want to ask that how to extract the values from dropdown list and from textbox, then total up them together and display the total? I googled around and tried different ways but it did not worked.
Still learning in HTML and JavaScript.
What is your height? (centimetres)
<select>
<option name="height1" value="100">100cm</option>
<option name="height1" value="101">101cm</option>
<option name="height1" value="102">102cm</option>
<option name="height1" value="103">103cm</option>
<option name="height1" value="104">104cm</option>
<option name="height1" value="105">105cm</option>
</select>
<br><br> What is your weight? (kg)
<input type="number" id="weight1" step="0.01" name="weight" pattern="\d{4}" autocomplete="off"><br><br> BMI: <input type="text" id="txtresult" name="bmi" readonly>
<input type="button" name="calculate" value="Calculate" onclick="calculate_bmi()">
function calculate_bmi()
{
/*var h = parseFloat(document.getElementById("height1").value);
var w = parseFloat(document.getElementById("weight1").value);
if ((h != parseFloat(h, 10)) || (w != parseFloat(w, 10)))
alert("Must insert number")
if ( ( h <= 0 ) || ( w <= 0 ) )
alert("Please insert positive numbers")
if ( ( h >= 2.7 ) || ( w >= 500 ) )
alert("Out of range");
else
{
var result = w / h / h;
result = Math.round(result * 100) / 100;
document.getElementById("txtresult").value = result;
}*/
var h = document.getElementsByName("height1");
//h = h / 100;
var w = parseFloat(document.getElementById("weight1").value);
var result = 0;
for (var i = 0; i < h.length; i++)
{
if(h[i].tagName == 'SELECT')
{
//result = w / Number(h[i].options[h[i].selectedIndex].value);
result = h + w;
}
if (h[i].checked)
{
//result = parseFloat(h[i].value);
result = h + w;
}
}
document.getElementById("txtresult").value = result.toFixed(2);
}
And I follows some solutions that available in Internet but it cannot works. The textbox values worked (commented code) but I want to use dropdown list and textbox to sum up together but I failed.
Note: Just want to sum up things together. Because I want to know how to get and add the values inside the dropdown list and textbox. Then I will do the rest of them (calculating BMI).
Thanks in advance.
To get the value from the dropdown/select element, you can use:
document.querySelector('select').value;
This will give you a string (words), however, since you want to do calculations with this input you need it to be a number (integer, float etc...) so we can use a + in front of this statement to convert it to a number:
+document.querySelector('select').value;
However, I recommend that you add an id to your select element so you can target it like so (adding an id will improve your code's runtime):
+document.getElementById('height').value;
To get the value from your textbox, you can do:
+document.getElementById('weight1').value;
Here we are also converting it to a number by using the + operator.
Lastly, to set the bmi's textbox to the calculated value you can use:
document.getElementById("txtresult").value = bmi;
See working example below:
function calculate_bmi() {
let height = +document.getElementById("height").value;
let weight = +document.getElementById("weight1").value;
let bmi = height + weight; // perform bmi calculation here
document.getElementById("txtresult").value = bmi;
}
What is your height? (centimetres)
<select id="height">
<option name="height1" value="100">100cm</option>
<option name="height1" value="101">101cm</option>
<option name="height1" value="102">102cm</option>
<option name="height1" value="103">103cm</option>
<option name="height1" value="104">104cm</option>
<option name="height1" value="105">105cm</option>
</select>
<br><br> What is your weight? (kg)
<input type="number" id="weight1" step="0.01" name="weight" pattern="\d{4}" autocomplete="off"><br><br> BMI: <input type="text" id="txtresult" name="bmi" readonly>
<input type="button" name="calculate" value="Calculate" onclick="calculate_bmi()">
You can use document.getElementsByName("height1")[0] to get the desired element, then use h.options[h.selectedIndex].value to find the selected value. Then, you can use parseFloat as usual:
function calculate_bmi() {
var h = document.getElementsByName("height1")[0];
h = parseFloat(h.options[h.selectedIndex].value);
// h = h / 100;
var w = parseFloat(document.getElementById("weight1").value);
console.log(h, w);
var result = h + w;
document.getElementById("txtresult").value = result.toFixed(2);
}
What is your height? (centimetres)
<select name="height1">
<option value="100">100cm</option>
<option value="101">101cm</option>
<option value="102">102cm</option>
<option value="103">103cm</option>
<option value="104">104cm</option>
<option value="105">105cm</option>
</select>
<br><br> What is your weight? (kg)
<input type="number" id="weight1" step="0.01" name="weight" pattern="\d{4}" autocomplete="off"><br><br> BMI: <input type="text" id="txtresult" name="bmi" readonly>
<input type="button" name="calculate" value="Calculate" onclick="calculate_bmi()">
As a side note, name should be added to the control (i.e. the <select> element) and not the values inside it (i.e. the <option> elements).
If you are trying to get the value from the dropdown list.
Get the Select element by name which stores it as an array, then run a for loop through the list and extract the value. See below,
function calculate_bmi() {
var value = 0;
var h = document.getElementsByName("height1");
for(var i = 0; i<h.length; i++){
if(h[i].selected){
value = h[i].value
// Do something with the value
}
}
}
This code worked for me. I modified your html a bit and added an id to the select box.
function calculate_bmi() {
/*var h = parseFloat(document.getElementById("height1").value);
var w = parseFloat(document.getElementById("weight1").value);
if ((h != parseFloat(h, 10)) || (w != parseFloat(w, 10)))
alert("Must insert number")
if ( ( h <= 0 ) || ( w <= 0 ) )
alert("Please insert positive numbers")
if ( ( h >= 2.7 ) || ( w >= 500 ) )
alert("Out of range");
else
{
var result = w / h / h;
result = Math.round(result * 100) / 100;
document.getElementById("txtresult").value = result;
}*/
var selectBox = document.getElementById("selectBox");
var h = parseFloat(selectBox.value);
//h = h / 100;
var w = parseFloat(document.getElementById("weight1").value);
var result = h+w;
document.getElementById("txtresult").value = result.toFixed(2);
}
<html>
<body>
What is your height? (centimetres)
<select id="selectBox">
<option name="height1" value="100">100cm</option>
<option name="height1" value="101">101cm</option>
<option name="height1" value="102">102cm</option>
<option name="height1" value="103">103cm</option>
<option name="height1" value="104">104cm</option>
<option name="height1" value="105">105cm</option>
</select>
<br /><br />
What is your weight? (kg)
<input
type="number"
id="weight1"
step="0.01"
name="weight"
pattern="\d{4}"
autocomplete="off"
/><br /><br />
BMI: <input type="text" id="txtresult" name="bmi" readonly />
<input
type="button"
name="calculate"
value="Calculate"
onclick="calculate_bmi()"
/>
</body>
<script>
</script>
</html>
I'm sorry that a few variables are in dutch, I could change it to English if necessary.
This script should calculate the fee of the textbox "kosten".
The fee is calculated by applying a percentage, this is made possible by selecting a number in the combobox.
For some reason, when clicking on the button "totaalfooi" to start the calculation and get a result, nothing happends..
Javascript code:
function berekenkosten() {
var inputkosten = document.getElementById('kosten');
var kosten = 0;
if (inputkosten.value != "") {
kosten = parseInt(inputkosten.value);
}
return kosten;
}
var procentfooi = new Array();
procentfooi["1"]=2;
procentfooi["2"]=2.5;
procentfooi["3"]=3;
procentfooi["4"]=3.5;
procentfooi["5"]=4;
function berekenfooi () {
var berekenfooi=0;
for(var i = 0;
i < procentfooi.length; i++) {
if(procentfooi[i].checked) {
berekenfooi=procentfooi[procentfooi[i].value];
break;
}
}
return berekenfooi;
}
function berekentotaal () {
var totaalfooi = (berekenfooi/100) * berekenkosten();
document.getElementById(totaalfooi).innerHTML = "Totale fooi bedraagt: $" + totaalfooi;
}
<div id="JSfee">Totale kosten <input type="text" id="kosten"> <br><br> Graad van tevredenheid op 5
<select>
<option value="1" >1</option>
<option value="2" >2</option>
<option value="3" >3</option>
<option value="4" >4</option>
<option value="5" >5</option>
</select>
<input type="button" value="bereken" onclick="berekentotaal()">
<br><br>
<div id="totaalfooi">
</div>
</div>
You had multiple syntax errors which are fixed in the example below.
You cannot have variables named the same as functions, these will overwrite each other.
You cannot treat a function variable as a value type, you have to invoke the function.
getElementById takes a string argument, you were passing "variables" that were unassigned.
You needed an ID on your select, to then choose it by. You were iterating over an array which was not bound to the DOM.
A few other modifications, this works in the snippet and if you copy it over, should work to fix your problems.
function berekenkosten() {
var inputkosten = document.getElementById('kosten');
var kosten = 0;
if (inputkosten.value != "") {
kosten = parseInt(inputkosten.value);
}
return kosten;
}
function berekenfooi () {
var procentfooi = document.getElementById("procentfooi");
var percentToReturn=procentfooi.options[procentfooi.selectedIndex].value;
console.log(percentToReturn + " with " + procentfooi.length);
return parseFloat(percentToReturn);
}
function berekentotaal () {
var totaalfooi = (berekenfooi()/100) * berekenkosten();
document.getElementById("totaalfooi").innerHTML = "Totale fooi bedraagt: $" + totaalfooi;
}
<div id="JSfee">Totale kosten <input type="text" id="kosten"> <br><br> Graad van tevredenheid op 5
<select id='procentfooi'>
<option value="1" >1</option>
<option value="2" >2</option>
<option value="3" >3</option>
<option value="4" >4</option>
<option value="5" >5</option>
</select>
<input type="button" value="bereken" onclick="berekentotaal()">
<br><br>
<div id="totaalfooi">
</div>
</div>
Snippet results:
Change your code to this
function berekenkosten() {
var inputkosten = document.getElementById('kosten');
var kosten = 0;
if (inputkosten.value != "") {
kosten = parseInt(inputkosten.value);
}
return kosten;
}
function berekenfooi() {
var berekenfooi = 0,
seloption = document.querySelector('#JSfee select'),
procentfooi = [2, 2.5, 3, 3.5, 4]
return procentfooi[seloption.selectedIndex];
}
function berekentotaal() {
var totaalfooi = (berekenfooi()/100) * berekenkosten();
document.getElementById('totaalfooi').innerHTML = "Totale fooi bedraagt: $" + totaalfooi;
}
You have some syntactical errors in your berekentotaal function, berekenfooi is a function not an object therefore must be called with () and getElementById requires an string to find the element. With this solution you don't need the values in the select so they could be written like this
<select>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select>
Skimming through your code, it seems that the problem lies in this line:
document.getElementById(totaalfooi).innerHTML = "Totale fooi bedraagt: $" + totaalfooi;
totaalfooi is a result of a calculation, so I guess you meant to pass the string:
document.getElementById('totaalfooi').innerHTML = "Totale fooi bedraagt: $" + totaalfooi;
Also, in this line:
var totaalfooi = (berekenfooi/100) * berekenkosten();
You're dividing berekenfooi by 100, but berekenfooi is a function you define earlier, not a value. So it should be:
var totaalfooi = (berekenfooi()/100) * berekenkosten();
I want to assign a drop down option to a unique ID so that when it is selected, the javascript will take that ID and turn it into a variable which I can use to display the cost.
This is what I have so far:
<form>
<select>
<option name ="Bristol "value="40.0" id="BN1">Bristol - Newcastle</option>
</select>
<button type="button" onclick="BookingFare(); return false;">Submit</button><br>
</form>
function BookingFare() {
var price = 0;
//var ofAdults = document.getElementById('adults').value;
//var ofChildren = document.getElementById('children').value;
var BN1 = document.getElementById('BN1').value;
if (BN1) {
var price = price + 40;
}
document.getElementById('priceBox').innerHTML = price;
}
I can't get it to display the price, even when I just try to get it to print out "hello" when BN1 is selected it doesn't work. Can anyone tell me what I'm missing?
function BookingFare() {
var price = 0;
//var ofAdults = getElementById('adults').value;
//var ofChildren = getElementById('children').value;
var BN1 = document.getElementById('BN1').value;
if (BN1) {
var price = price + 40;
}
document.getElementById('priceBox').innerHTML = price;
}
<form>
<select id="BN1">
<option name ="Bristol "value="40.0" >Bristol - Newcastle</option>
</select>
<button type="button" onclick="BookingFare(); return false;">Submit</button><br>
</form>
<label id='priceBox'></label>
oke i have select field
<select id="select" required name="bank" >
<option value="cash">Cash</option>
<option value="debit">Debit Card</option>
<option value="cc">Credit Card</option>
</select>
and the text field to show price
<input type="text" id="sub_total" name="sub_total">
<input type="text" id="fee" name="fee">
<input type="text" id="sum" name="total">
and the javascript
var total = 0;
var fees = 0;
var total_fees = fees + total;
$("#sub_total").val(total);
$("#fee").val(fees);
$("#sum").val(total_fees);
so the point is i want to change the "fees" value from "0" to "0.1 or what ever i want" if select credit card
the pseudecode is
if select cc
var fees = '0.1';
else
var fees = '0';
$('#select').change(function() {
if($(this).val() == "cc")
{
$('#fee').val(0.1);
}
});
Use a ternary operator to switch between 0 and .1 based on the select value
var fees = ($("#select").val() === "cc" ? 0.1 : 0);
You should wrap this in a function, and bind the select element to this function on change.
e.g. :
var sel = $("#select");
function setValue() {
var total = 0,
fees = (sel.val() === "cc" ? 0.1 : 0); // ternary
$("#sub_total").val(total);
$("#fee").val(fees);
$("#sum").val(fees + total); // sum
}
setValue(); // call function
sel.bind('change', setValue); // bind function to onchange of the select element