title: Why do I keep getting ReferenceError: * is not defined?
body: <p>New to Javascript and I can't get the error message ReferenceError: calculateOrder is not defined to go away no matter what I try. I've moved my var out and back in tried different statements. Nothing of the knowledge I have so far is working. How can I get rid of this error message? Would appreciate any help or pointers I can get.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var cost = 750;
  
  var pasta_prices = new Array();
  pasta_prices["spaghetti"] = 0;
  pasta_prices["fettucine"] = 50;
  pasta_prices["fusilli"] = 75;
  
  var sauce_prices = new Array();
  sauce_prices["pomodoro"] = 0;
  sauce_prices["bolognese"] = 50;
  sauce_prices["alfredo"] = 100;
  
  function getPastaPrice() {
   var pastaPrice = 0;
  
   var form = document.forms["myForm"];
  
   var selectedPasta = myForm.elements["pastatype"];
  
   for (var i = 0; i &lt; selectedPasta.length; i++) {
  
    if (selectedPasta[i].checked) {
     pastaPrice = pasta_prices[selectedPasta[i].value];
     break;
    }
   }
   return pastaPrice;
  }
  
  
  function getSaucePrice() {
   var saucePrice = 0;
  
   var myForm = document.forms["myForm"];
  
   var selectedSauce = myForm.elements["sauce"];
  
   saucePrice = sauce_prices[selectedSauce.value];
  
   return saucePrice;
  }
  
  function extrasPrice() {
   var extraPrice = 0;
  
   var myForm = document.forms["myForm"];
  
   var includeSalad = myForm.elements["salad"];
   var includeSticks = myForm.elements["sticks"];
  
   if (includeSalad.checked == true) {
    extraPrice = 200;
   }
  
   if (includeSticks.checked == true) {
  
    extraPrice = 100;
  
   }
  
   return extraPrice;
  }
  
  function calculateOrder() {
   var ordCost = cost + getPastaPrice() + getSaucePrice() + extrasPrice();
  
   console.log((ordCost / 100).toFixed(2));
  
   return ordCost;
  
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
  &lt;head&gt;
  &lt;meta name="description" content="Costello Improved"&gt;
  &lt;meta http-equiv="Content-type" content="text/html;charset=UTF-8" /&gt;
  &lt;title&gt;Costellos Pasta and Pizza&lt;/title&gt;
  &lt;script language="JavaScript" type="text/javascript" src="costello.js"&gt;&lt;/script&gt;
  &lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous"&gt;
    
    &lt;style&gt;
      .col-md-12{
      text-align: center;
      font-size: 3em;
      background-color: red;
  }
  
  .msg{
      text-align:center;
      font-size: 1.3em;
      color: red;
  }
  
  .row{
      margin-top: 10px;
      border: 5px solid white;
      background-color: silver;
      padding: 10px;
  }
  
  .label{
      text-align:center;
      vertical-align:top;
  }
  
  #submitMessage{
      transition: opacity 10s;
  }
  
  #cancel{
      text-decoration: underline;
  }
    &lt;/style&gt;
    
  &lt;/head&gt;
  
  &lt;body&gt;
  
  &lt;form  name="myForm" action="https://costello-pasta.glitch.me/order" id="myForm" method="POST" onsubmit="return calculateOrder()"&gt;
        &lt;div class="container"&gt;
  
  
          &lt;div class="row"&gt;
              &lt;div class="col-md-12" id="debug"&gt;Costello's Online Orders&lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div class="row"&gt;
            &lt;div   class="col-md-4  label"&gt;Pasta Bowl&lt;/div&gt;
            &lt;div class="col-md-4"  &gt; (basic price: $7.50)&lt;/div&gt;
            &lt;div class="col-md-4"  &gt;&lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div class="row"&gt;
            &lt;div   class="col-md-4  label"&gt;Pasta&lt;/div&gt;
            &lt;div class="col-md-4" &gt;
              &lt;div&gt;&lt;input type="radio" name="pastatype" value="0" id="spaghetti"/&gt;Spaghetti (no extra cost)&lt;/div&gt;
              &lt;div&gt;&lt;input type="radio" name="pastatype" value="50" id="fettucine"/&gt;Fettucine (add 50 cents)&lt;/div&gt;
              &lt;div&gt;&lt;input type="radio" name="pastatype" value="75" id="fusilli"/&gt;Fusilli (add 75 cents)&lt;/div&gt;
              &lt;/div&gt;
            &lt;div  class="col-md-4 msg" id="radioLabel"&gt;&lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div class="row"&gt;
            &lt;div   class="col-md-4  label"&gt;Sauce&lt;/div&gt;
            &lt;div class="col-md-4" &gt;
              &lt;select name="sauce" &gt;
              &lt;option value="0" id="pomodoro"&gt;Pomodoro (no extra cost)&lt;/option&gt;
              &lt;option value="50" id="bolognese"&gt;Bolognese (add 50 cents)&lt;/option&gt;
              &lt;option value="100" id="alfredo"&gt;Alfredo (add $1.00)&lt;/option&gt;
              &lt;/select&gt;
              &lt;/div&gt;
            &lt;div class="col-md-4" &gt;&lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div class="row"&gt;
            &lt;div   class="col-md-4  label"&gt;Extras&lt;/div&gt;
            &lt;div class="col-md-4" &gt;
               &lt;div&gt;&lt;input type="checkbox" name="extras" value="200" id="salad"/&gt;Side salad (add $2.00)&lt;/div&gt;
               &lt;div&gt;&lt;input type="checkbox" name="extras" value="100" id="sticks"/&gt;Bread sticks (add $1.00)&lt;/div&gt;
            &lt;/div&gt;
            &lt;div class="col-md-4" &gt;&lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div class="row"&gt;
            &lt;div   class="col-md-4  label"&gt;Name&lt;/div&gt;
            &lt;div class="col-md-4" &gt;&lt;input type="text" id="name" name="client_name" /&gt;&lt;/div&gt;
            &lt;div class="col-md-4 msg"  id="nameLabel"&gt;&lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div class="row"&gt;
            &lt;div   class="col-md-4  label"&gt;Phone&lt;/div&gt;
            &lt;div class="col-md-4" &gt;&lt;input type="text" id="phone" value="" /&gt;&lt;/div&gt;
            &lt;div class="col-md-4 msg"  id="phoneLabel"&gt;&lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div class="row"&gt;
            &lt;div   class="col-md-4  label"&gt;&lt;input type="submit" value="Order"   /&gt;&lt;/div&gt;
            &lt;div class="col-md-4"  id="totalcost"&gt;&lt;/div&gt;
            &lt;div class="col-md-4 msg"  id="submitMessage"&gt;&lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  
  &lt;/form&gt;
  
  
  
  
  &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>