Heather Won
Heather Won

Reputation: 23

cost calculator using Javascript

I am creating a cost calculator using JavaScript. I have two button in my code; clear and calculate and both work fine for the first time. However when I select different drop down menu and try to calculate again, it doesn't recalculate but same number or blank fields stay in the table.

How do I make it to recalculate? and is it possible to do this without clear button?

var settingValue;
    
    function clearForm(){
    document.getElementById("myForm").reset();
    }
    
    
    function settingValue() {
      var payment;
      var copayPerc = document.getElementById("copayPerc").value;
      settingValue = document.getElementById("Setting").value;
       payment=medicarePaymentCal(settingValue); 
       document.getElementById("medipayment").value = payment;
       document.getElementById("adj").value=seqAdjCal(payment);
    	 document.getElementById("net").value=payment+seqAdjCal(payment);
       
       document.getElementById("copay").value=payment*0.2;
       document.getElementById("actualCopay").value=payment*0.2*copayPerc;
       totalProductCost();
    }
    
    
    function medicarePaymentCal(value1) {
      var result;
      if (value1 == "Office") {
        return 1411.21;
      } else if (value1="HOPD") {
        return 500;
      }
     }
     
     function seqAdjCal(val){
      return -(0.02*(0.8*val));
     
     }
     
     function totalProductCost(){
      var applications=document.getElementById("applications").value;
      var productCost=document.getElementById("productCost").value;
      var total=applications*productCost;
     	document.getElementById("totalProductCost").value = total;
     }
     
<html>
  <head>
    </head>
  <body>
    <form method="post" id="myForm">
    <table border=1>
    <tr>
      <td>Setting : </td>
      <td><select id="Setting">
        <option value="Office">Office</option>
        <option value="HOPD">HOPD</option>
      </select></td>
    </tr>
    <tr>
      <td>Facility : </td>
      <td><select id="Facility">
        <option value="100015">Mount Sinai, 123 Main Street, New York</option>
        <option value="100016">NYU Medical, 25 North Broadway, New York</option>
      </select></td>
    
      <tr>
          <td>Product Size : </td>
          <td>
            <100sq cm</td>
        </tr>
    
        <tr>
          <td>Number of DFU patients :</td>
          <td>10</td>
        </tr>
        <tr>
          <td>Patient co-pay % (based on wage adj.rate) : </td>
          <td>0.2</td>
        </tr>
        <tr>
          <td>Co-Pay percent actuallly collected : </td>
          <td><input id="copayPerc" type="number" value="0.75"></td>
        </tr>
    
        <tr>
          <td><input type="button" id="clear" value="Clear" onclick="clearForm();">
    	</td>
          <td>
            <input type="button" id="button" value="calculate" onclick="settingValue();">
          </td>
        </tr>
    
    </table>
    
    
      <table border=1>
      
    
        <tr>
          <td>Medicare Payment :</td>
          <td>
            <input type="number" id="medipayment">
          </td>
        </tr>
    
    <tr>
    	<td>Sequestration Adjustment (-2%) : </td>
    	<td> <input type="number" id="adj"> </td>
    </tr>
    <tr>
    	<td>Medicare Payment Net of Seq. : </td>
    	<td> <input type="number" id="net"> </td>
    </tr>
    <tr>
    	<td>Projected Patient Co-Pay : </td>
    	<td> <input type="number" id="copay"> </td>
    </tr>
    
    <tr>
    	<td>Actual Co-Pay Amount Collected : </td>
    	<td> <input type="number" id="actualCopay"> </td>
    </tr>
    
    <tr>
    	<td>No. of applications per Episode : </td>
    	<td> <input type="number" id="applications" value="1"> </td>
    </tr>
    
    <tr>
    	<td>Product cost per treatment : </td>
    	<td> <input type="number" id="productCost" value="1125"> </td>
    </tr>
    
    <tr>
    <td>Total product cost per episode : </td>
    	<td> <input type="number" id="totalProductCost"> </td>
    </tr>
    
    
    
      </table>
    
    </form>
  </body>
    </html>
 

Upvotes: 0

Views: 2912

Answers (1)

Marcus Vilete
Marcus Vilete

Reputation: 220

Your var settingValue has same name as function settingValue.

Just rename one and should work:

  var settingValue;

  function clearForm() {
    document.getElementById("myForm").reset();
  }


  function funcSettingValue() {
    var payment;
    var copayPerc = document.getElementById("copayPerc").value;
    settingValue = document.getElementById("Setting").value;
    payment = medicarePaymentCal(settingValue);
    document.getElementById("medipayment").value = payment;
    document.getElementById("adj").value = seqAdjCal(payment);
    document.getElementById("net").value = payment + seqAdjCal(payment);

    document.getElementById("copay").value = payment * 0.2;
    document.getElementById("actualCopay").value = payment * 0.2 * copayPerc;
    totalProductCost();
  }


  function medicarePaymentCal(value1) {
    var result;
    if (value1 == "Office") {
      return 1411.21;
    } else if (value1 = "HOPD") {
      return 500;
    }
  }

  function seqAdjCal(val) {
    return -(0.02 * (0.8 * val));

  }

  function totalProductCost() {
    var applications = document.getElementById("applications").value;
    var productCost = document.getElementById("productCost").value;
    var total = applications * productCost;
    document.getElementById("totalProductCost").value = total;
  }
<html>
<form method="post" id="myForm">
  <table border=1>
    <tr>
      <td>Setting :</td>
      <td>
        <select id="Setting">
          <option value="Office">Office</option>
          <option value="HOPD">HOPD</option>
        </select>
      </td>
    </tr>
    <tr>
      <td>Facility :</td>
      <td>
        <select id="Facility">
          <option value="100015">Mount Sinai, 123 Main Street, New York</option>
          <option value="100016">NYU Medical, 25 North Broadway, New York</option>
        </select>
      </td>

      <tr>
        <td>Product Size :</td>
        <td>
          <100sq cm</td>
      </tr>

      <tr>
        <td>Number of DFU patients :</td>
        <td>10</td>
      </tr>
      <tr>
        <td>Patient co-pay % (based on wage adj.rate) :</td>
        <td>0.2</td>
      </tr>
      <tr>
        <td>Co-Pay percent actuallly collected :</td>
        <td>
          <input id="copayPerc" type="number" value="0.75">
        </td>
      </tr>

      <tr>
        <td>
          <input type="button" id="clear" value="Clear" onclick="clearForm();">
        </td>
        <td>
          <input type="button" id="button" value="calculate" onclick="funcSettingValue();">
        </td>
      </tr>

  </table>


  <table border=1>


    <tr>
      <td>Medicare Payment :</td>
      <td>
        <input type="number" id="medipayment">
      </td>
    </tr>

    <tr>
      <td>Sequestration Adjustment (-2%) :</td>
      <td>
        <input type="number" id="adj">
      </td>
    </tr>
    <tr>
      <td>Medicare Payment Net of Seq. :</td>
      <td>
        <input type="number" id="net">
      </td>
    </tr>
    <tr>
      <td>Projected Patient Co-Pay :</td>
      <td>
        <input type="number" id="copay">
      </td>
    </tr>

    <tr>
      <td>Actual Co-Pay Amount Collected :</td>
      <td>
        <input type="number" id="actualCopay">
      </td>
    </tr>

    <tr>
      <td>No. of applications per Episode :</td>
      <td>
        <input type="number" id="applications" value="1">
      </td>
    </tr>

    <tr>
      <td>Product cost per treatment :</td>
      <td>
        <input type="number" id="productCost" value="1125">
      </td>
    </tr>

    <tr>
      <td>Total product cost per episode :</td>
      <td>
        <input type="number" id="totalProductCost">
      </td>
    </tr>



  </table>

</form>

</html>

Upvotes: 2

Related Questions