title: Javascript - Function is not defined (onChange doesn't work)
body: <p>I am calling a function called getPrice() in javascript file by using onChange() command in  tag in HTML file, but no matter what I do or fix, it still doesnt show the price. I have done a lot of research but cant seem to find any correct solutions. Helps will be greatly appreciated.</p>
  
  <p>Here is my HTML code: </p>
  
  <pre><code>    &lt;body&gt;
              &lt;form action="#" name="ITSbookform" id="ITSform"&gt;
                      &lt;fieldset&gt;
                      &lt;legend&gt;Into The Storm Booking&lt;/legend&gt;
                      &lt;label&gt;Choose your cinema&lt;/label&gt;&lt;br&gt;
                      &lt;select id="selectedCinema"&gt;
                      &lt;option&gt;--Select--&lt;/option&gt;
                      &lt;option value="maximaCinema"&gt;Maxima Cinema&lt;/option&gt; 
                      &lt;option value="rivolaCinema"&gt;Rivola Cinema&lt;/option&gt; 
                      &lt;/select&gt;&lt;br&gt;
                      &lt;label&gt;Select day and time&lt;/label&gt;
  
                      &lt;select id="dayAndTime"&gt;
  
                      &lt;/select&gt;
                      &lt;br&gt;
                      &lt;label&gt;Select Seat&lt;/label&gt;
                      &lt;select id="selectedSeat" onchange="getPrice()"&gt;
  
                      &lt;/select&gt;
                      &lt;p id="total"&gt;Total Price: &lt;/p&gt;
  
  
              &lt;/form&gt;
      &lt;/fieldset&gt;
  
      &lt;/body&gt;
  </code></pre>
  
  <p></p>
  
  <p>and the Javascipt part: </p>
  
  <pre><code>    function getPrice(){
      var totalPrice = 0;
      if(document.getElementById("selectedCinema").value == "maximaCinema"){
          if(document.getElementById("dayAndTime").value == "9pmMonday" || document.getElementById("dayAndTime").value == "9pmTuesday"){
              seatPrice["full"] = 12;
              seatPrice["conc"] = 10;
              seatPrice["child"] = 8;
              seatPrice["FirstClass-Adult"] = 25;
              seatPrice["FirstClass-Child"] = 20;
              seatPrice["beanbag"] = 20;
          }
          else{
              seatPrice["full"] = 18;
              seatPrice["conc"] = 15;
              seatPrice["child"] = 12;
              seatPrice["FirstClass-Adult"] = 30;
              seatPrice["FirstClass-Child"] = 25;
              seatPrice["beanbag"] = 30;
          }
      }
      else{
          seatPrice["adult"] = 18;
          seatPrice["conc"] = 15;
          seatPrice["child"] = 12;
      }
  
      var seat = theForm.elements["selectedSeat"];
      totalPrice = seatPrice[seat.value];
      document.getElementById("total").innerHTML = "$" + totalPrice;
  }
  </code></pre>
  
  <p>and here is the full version of the code in JSFiddle: <a href="http://jsfiddle.net/stb0v5Ln/" rel="nofollow">http://jsfiddle.net/stb0v5Ln/</a></p>
  
  <p>Thank you.</p>