title: Html/Javascript form calculation and validation in new page
body: <p>I'm working on a website project and really need help as I'm new to all this. I'm basically given values to every option in the drop down menu's and make them add together which I've managed. But then I want to the total value from the menus to then be the range for a pseudo random to be a generated and added to the age I input. </p>
  
  <p>When I hit submit I'd like it to calculate all that and display the result on a new page. I want to be able to do all this within javascript and html. </p>
  
  <p>Any help would be greatly appreciated! My coding is below. Thanks so much! </p>
  
  <pre><code>        &lt;body&gt;
          &lt;form id="form1" action="" method="post" onsubmit="return calcTotal(this)"&gt;
          &lt;select name=select1&gt;
              &lt;option selected="selected" value="0"&gt;Chinese Zodiac&lt;/option&gt;
          &lt;option value="3"&gt;Rat&lt;/option&gt;
          &lt;option value="3"&gt;Ox&lt;/option&gt;
          &lt;option value="4"&gt;Tiger&lt;/option&gt;
          &lt;option value="2"&gt;Rabbit&lt;/option&gt;
          &lt;option value="4"&gt;Dragon&lt;/option&gt;
          &lt;option value="5"&gt;Snake&lt;/option&gt;
          &lt;option value="3"&gt;Horse&lt;/option&gt;
          &lt;option value="3"&gt;Sheep&lt;/option&gt;
          &lt;option value="4"&gt;Monkey&lt;/option&gt;
          &lt;option value="5"&gt;Rooster&lt;/option&gt;
          &lt;option value="3"&gt;Dog&lt;/option&gt;
          &lt;option value="3"&gt;Pig&lt;/option&gt;
          &lt;/select&gt;
          &lt;/select&gt;
          &lt;br /&gt;
          &lt;select name=select2&gt;
              &lt;option selected="selected" value="0"&gt;Star Sign&lt;/option&gt;
          &lt;option value="2"&gt;Aries&lt;/option&gt;
          &lt;option value="4"&gt;Taurus&lt;/option&gt;
          &lt;option value="3"&gt;Gemini&lt;/option&gt;
          &lt;option value="4"&gt;Cancer&lt;/option&gt;
          &lt;option value="3"&gt;Leo&lt;/option&gt;
          &lt;option value="2"&gt;Virgo&lt;/option&gt;
          &lt;option value="2"&gt;Libra&lt;/option&gt;
          &lt;option value="3"&gt;Scorpio&lt;/option&gt;
          &lt;option value="2"&gt;Sagittarius&lt;/option&gt;
          &lt;option value="4"&gt;Capricorn&lt;/option&gt;
          &lt;option value="2"&gt;Aquarius&lt;/option&gt;
          &lt;option value="3"&gt;Pisces&lt;/option&gt;
          &lt;/select&gt;
          &lt;br /&gt;
  
          &lt;select name=select3&gt;
              &lt;option selected="selected" value="0"&gt;Blood Type&lt;/option&gt;
          &lt;option value="3"&gt;O&lt;/option&gt;
          &lt;option value="2"&gt;A&lt;/option&gt;
          &lt;option value="1"&gt;B&lt;/option&gt;
          &lt;option value="3"&gt;AB&lt;/option&gt;
          &lt;/select&gt;
          &lt;br /&gt;
  
          &lt;select name=select4&gt;
              &lt;option selected="selected" value="0"&gt;Favourite Colour&lt;/option&gt;
          &lt;option value="3"&gt;Black&lt;/option&gt;
          &lt;option value="3"&gt;Blue&lt;/option&gt;
          &lt;option value="2"&gt;Brown&lt;/option&gt;
          &lt;option value="2"&gt;Green&lt;/option&gt;
          &lt;option value="3"&gt;Orange&lt;/option&gt;
          &lt;option value="3"&gt;Pink&lt;/option&gt;
          &lt;option value="2"&gt;Purple&lt;/option&gt;
          &lt;option value="4"&gt;Red&lt;/option&gt;
          &lt;option value="2"&gt;Yellow&lt;/option&gt;
          &lt;option value="2"&gt;White&lt;/option&gt;
          &lt;option value="5"&gt;Other&lt;/option&gt;
          &lt;/select&gt;
          &lt;br /&gt;
  
          Age&lt;input name="" type="number" value="" /&gt; 
  
          &lt;br /&gt;
  
          &lt;input name="" type="submit" value="Total" /&gt;
          &lt;span&gt;Total: &lt;/span&gt;&lt;span id="result"&gt;&lt;/span&gt;
      &lt;/form&gt;
  
  
  &lt;script type="text/javascript"&gt;
  function calcTotal(oForm){
      var sum = 0;
      for(i=0; i &lt; oSels.length; i++){
          sum += new Number(oSels[i].value);
      }
      document.getElementById('result').innerHTML = sum;
      return false;
  }
  window.onload=function(){
      oSels = document.getElementById('form1').getElementsByTagName('select');
      for(i=0; i &lt; oSels.length; i++){
          oSels[i].onchange=function(){
              document.getElementById('result').innerHTML = '';
          }
  
  
      }
  }
  &lt;/script&gt;
  </code></pre>