JSFiddle - React, Tailwind, and code Playground

HTML

<FORM Name="myform">
<SELECT NAME="memoryItem" onChange="calculatePrice()" id="memoryItem">
  <OPTION value="0">Select One Choice from List-Memory Upgrade</OPTION>
  <OPTION value="49">8 GB add $49</OPTION>
  <OPTION value="98">12 GB add $98</OPTION>
  <OPTION value="159">16 GB add $159</OPTION>
</SELECT>

<SELECT NAME="hddItem" onChange="calculatePrice()" id="hddItem">
  <OPTION value="0">Select One Choice from List-HDD Upgrade</OPTION>
  <OPTION value="109">1 TB HD add $109</OPTION>
  <OPTION value="150">1.5 TB HD add $150</OPTION>
  <OPTION value="199">2 TB HD add $199</OPTION>
  <OPTION value="299">250 GB SSD add $299</OPTION>
</SELECT>

<SELECT NAME="networkItem" onChange="calculatePrice()" id="networkItem">
  <OPTION value="0">Select One Choice from List- Network Upgrade</OPTION>
  <OPTION value="109">56K V90 or X2 Modem add $109</OPTION>
  <OPTION value="79">10/100 NIC add $79</OPTION>
  <OPTION value="279">Combo Modem and NIC add $279</OPTION>
</SELECT>
</FORM>

<button type="button" onclick="calculatePrice()">Calculate</button>

The new calculated price:<INPUT type="text" id="PicExtPrice" Size=8>

JavaScript

function calculatePrice(myform){

  //Get selected data  
  var elt = document.getElementById("memoryItem");
  var memory = elt.options[elt.selectedIndex].value;
    
  var elt = document.getElementById("hddItem");
  var hdd = elt.options[elt.selectedIndex].value;
    
  var elt = document.getElementById("networkItem");
  var network = elt.options[elt.selectedIndex].value;
    
  //convert data to integers
  memory = parseInt(memory);
  hdd = parseInt(hdd);
  network = parseInt(network);
    
  //calculate total value  
  var total = memory+hdd+network; 
    
  //print value to  PicExtPrice 
  document.getElementById("PicExtPrice").value=total;

}