JSFiddle - React, Tailwind, and code Playground
HTML
<form>
<h1>Fare Calculator</h1>
<h2>Select Embarkation/Debarkation Point</h2>
<select id="bild" onchange="bBild()">
<option class="GUADALUPE" value="0">Guadalupe</option>
<option class="PINAGBUHATAN" value="0">Pinagbuhatan</option>
<option class="SAN JOAQUIN" value="0">San Joaquin</option>
<option class="STA. ANA" value="0" selected>Sta. Ana</option>
<option class="PUP" value="0">PUP</option>
<option class="ESCOLTA" value="0">Escolta</option>
<option class="INTRAMUROS" value="0">Intramuros</option>
</select>
<select id="bio" onchange="bBio()">
<option class="GUADALUPE" value="0">Guadalupe</option>
<option class="PINAGBUHATAN" value="45">Pinagbuhatan</option>
<option class="SAN JOAQUIN" value="18">San Joaquin</option>
<option class="STA. ANA " value="20" selected>Sta. Ana</option>
<option class="PUP" value="50">PUP</option>
<option class="ESCOLTA" value="50">Escolta</option>
<option class="INTRAMUROS" value="50">Intramuros</option>
</select>
<input type="button" value="Calculate" onClick="GetSelectedItem();">
</form>
JavaScript
function bBio()
{
var bio = document.getElementById("bio");
var biobetyg = parseFloat(bio.options[bio.selectedIndex].value);
return biobetyg;
}
function bBild()
{
var bild = document.getElementById("bild");
var bildbetyg = parseFloat(bild.options[bild.selectedIndex].value);
return bildbetyg;
}
function GetSelectedItem()
{
var merit = bBio() + bBild();
var strSel = "The Value is: " + merit ;
alert(strSel);
}