Ik ben met een calculatie formulier bezig voor mijn website. Moet heel eerlijk zijn dat ik een noob ben op het gebied van HTML en Javascript. Maar goed je moet ergens beginnen. Het formulier is gemaakt en ik weet de calculaties die er aan moeten worden toegevoegd maar heb geen idee hoe dit te doen in javascript/html.
Bekijk bijlage Trainingsspeed Calculations.txt
De calculaties zijn uitgelegd in het text bestand wat is toegevoegd. Ik hoop dat jullie kunnen helpen. Alvast bedankt voor de moeite.
Met vriendelijk groet,
scorro
Bekijk bijlage Trainingsspeed Calculations.txt
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Naamloos document</title>
</head>
<form action="" id="Trainingsspeedcalculator" onsubmit="return false;">
<fieldset>
<h1>Trainingsspeedcalculator</h1>
<h3>Years</h3>
<select id="Age" name='Age'
onchange="calculateTotal()">
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
</select>
<h3>Days</h3><select id="Days" name='Days'
onchange="calculateTotal()">
<option value="0">0</option
><option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
<option value="32">32</option>
<option value="33">33</option>
<option value="34">34</option>
<option value="35">35</option>
<option value="36">36</option>
<option value="37">37</option>
<option value="38">38</option>
<option value="39">39</option>
<option value="40">40</option>
<option value="41">41</option>
<option value="42">42</option>
<option value="43">43</option>
<option value="44">44</option>
<option value="45">45</option>
<option value="46">46</option>
<option value="47">47</option>
<option value="48">48</option>
<option value="49">49</option>
<option value="50">50</option>
<option value="51">51</option>
<option value="52">52</option>
<option value="53">53</option>
<option value="54">54</option>
<option value="55">55</option>
<option value="56">56</option>
<option value="57">57</option>
<option value="58">58</option>
<option value="59">59</option>
<option value="60">60</option>
<option value="61">61</option>
<option value="62">62</option>
<option value="63">63</option>
<option value="64">64</option>
<option value="65">65</option>
<option value="66">66</option>
<option value="67">67</option>
<option value="68">68</option>
<option value="69">69</option>
<option value="70">70</option>
<option value="71">71</option>
<option value="72">72</option>
<option value="73">73</option>
<option value="74">74</option>
<option value="75">75</option>
<option value="76">76</option>
<option value="77">77</option>
<option value="78">78</option>
<option value="79">79</option>
<option value="80">80</option>
<option value="81">81</option>
<option value="82">82</option>
<option value="83">83</option>
<option value="84">84</option>
<option value="85">85</option>
<option value="86">86</option>
<option value="87">87</option>
<option value="88">88</option>
<option value="89">89</option>
<option value="90">90</option>
<option value="91">91</option>
<option value="92">92</option>
<option value="93">93</option>
<option value="94">94</option>
<option value="95">95</option>
<option value="96">96</option>
<option value="97">97</option>
<option value="98">98</option>
<option value="99">99</option>
<option value="100">100</option>
<option value="101">101</option>
<option value="102">102</option>
<option value="103">103</option>
<option value="104">104</option>
<option value="105">105</option>
<option value="106">106</option>
<option value="107">107</option>
<option value="108">108</option>
<option value="109">109</option>
<option value="110">110</option>
<option value="111">111</option>
<option value="112">112</option>
</select>
<br/>
<div id="totalPrice"></div>
</fieldset>
</form>
<form action="" id="Trainingsspeedcalculator1" onsubmit="return false;">
<fieldset>
<h3>Trainer</h3>
<select id="Trainer" name='Trainer'
onchange="calculateTotal()">
<option value="None">None</option>
<option value="Disastrous">Disastrous</option>
<option value="Wretched">Wretched</option>
<option value="Poor">Poor</option>
<option value="Weak">Weak</option>
<option value="Inadequate">Inadequate</option>
<option value="Passable">Passable</option>
<option value="Solid">Solid</option>
<option value="Excellent">Excellent</option>
</select>
<br/>
<div id="totalPrice"></div>
<h3>Assistants</h3>
<select id="Assistants" name='Assistants'
onchange="calculateTotal()">
<option value="0">0</option
><option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select>
<br/>
<div id="totalPrice"></div>
<h3>Trainings Intensity</h3>
<select id="Trainings Intensity" name='Trainings Intensity'
onchange="calculateTotal()">
<option value="0">0</option
><option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
<option value="32">32</option>
<option value="33">33</option>
<option value="34">34</option>
<option value="35">35</option>
<option value="36">36</option>
<option value="37">37</option>
<option value="38">38</option>
<option value="39">39</option>
<option value="40">40</option>
<option value="41">41</option>
<option value="42">42</option>
<option value="43">43</option>
<option value="44">44</option>
<option value="45">45</option>
<option value="46">46</option>
<option value="47">47</option>
<option value="48">48</option>
<option value="49">49</option>
<option value="50">50</option>
<option value="51">51</option>
<option value="52">52</option>
<option value="53">53</option>
<option value="54">54</option>
<option value="55">55</option>
<option value="56">56</option>
<option value="57">57</option>
<option value="58">58</option>
<option value="59">59</option>
<option value="60">60</option>
<option value="61">61</option>
<option value="62">62</option>
<option value="63">63</option>
<option value="64">64</option>
<option value="65">65</option>
<option value="66">66</option>
<option value="67">67</option>
<option value="68">68</option>
<option value="69">69</option>
<option value="70">70</option>
<option value="71">71</option>
<option value="72">72</option>
<option value="73">73</option>
<option value="74">74</option>
<option value="75">75</option>
<option value="76">76</option>
<option value="77">77</option>
<option value="78">78</option>
<option value="79">79</option>
<option value="80">80</option>
<option value="81">81</option>
<option value="82">82</option>
<option value="83">83</option>
<option value="84">84</option>
<option value="85">85</option>
<option value="86">86</option>
<option value="87">87</option>
<option value="88">88</option>
<option value="89">89</option>
<option value="90">90</option>
<option value="91">91</option>
<option value="92">92</option>
<option value="93">93</option>
<option value="94">94</option>
<option value="95">95</option>
<option value="96">96</option>
<option value="97">97</option>
<option value="98">98</option>
<option value="99">99</option>
<option value="100">100</option>
</select>
<br/>
<div id="totalPrice"></div>
<h3>Stamina Intensity</h3>
<select id="Stamina Intensity" name='Stamina Intensity'
onchange="calculateTotal()">
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
<option value="32">32</option>
<option value="33">33</option>
<option value="34">34</option>
<option value="35">35</option>
<option value="36">36</option>
<option value="37">37</option>
<option value="38">38</option>
<option value="39">39</option>
<option value="40">40</option>
<option value="41">41</option>
<option value="42">42</option>
<option value="43">43</option>
<option value="44">44</option>
<option value="45">45</option>
<option value="46">46</option>
<option value="47">47</option>
<option value="48">48</option>
<option value="49">49</option>
<option value="50">50</option>
<option value="51">51</option>
<option value="52">52</option>
<option value="53">53</option>
<option value="54">54</option>
<option value="55">55</option>
<option value="56">56</option>
<option value="57">57</option>
<option value="58">58</option>
<option value="59">59</option>
<option value="60">60</option>
<option value="61">61</option>
<option value="62">62</option>
<option value="63">63</option>
<option value="64">64</option>
<option value="65">65</option>
<option value="66">66</option>
<option value="67">67</option>
<option value="68">68</option>
<option value="69">69</option>
<option value="70">70</option>
<option value="71">71</option>
<option value="72">72</option>
<option value="73">73</option>
<option value="74">74</option>
<option value="75">75</option>
<option value="76">76</option>
<option value="77">77</option>
<option value="78">78</option>
<option value="79">79</option>
<option value="80">80</option>
<option value="81">81</option>
<option value="82">82</option>
<option value="83">83</option>
<option value="84">84</option>
<option value="85">85</option>
<option value="86">86</option>
<option value="87">87</option>
<option value="88">88</option>
<option value="89">89</option>
<option value="90">90</option>
<option value="91">91</option>
<option value="92">92</option>
<option value="93">93</option>
<option value="94">94</option>
<option value="95">95</option>
<option value="96">96</option>
<option value="97">97</option>
<option value="98">98</option>
<option value="99">99</option>
<option value="100">100</option>
</select>
<br/>
<div id="totalPrice"></div>
</fieldset>
</form>
<form action="" id="Trainingsspeedcalculator1" onsubmit="return false;">
<fieldset>
<h3>Training</h3>
<select id="Training" name='Training'
onchange="calculateTotal()">
<option value="None">None</option>
<option value="Goalkeeping">Goalkeeping</option>
<option value="Defending">Defending</option>
<option value="Defensive Positions">Defensive Positions</option>
<option value="Crossing(Winger)">Crossing(Winger)</option>
<option value="WingAttack">WingAttack</option>
<option value="Playmaking">Playmaking</option>
<option value="Scoring">Scoring</option>
<option value="Shooting">Shooting</option>
<option value="Short Passes">Short Passes</option>
<option value="Through Passes">Through Passes</option>
<option value="Set Pieces">Set Pieces</option>
</select>
<br/>
<div id="totalPrice"></div>
<h3>Current skill level</h3>
<select id="Current skill level" name='Current skill level'
onchange="calculateTotal()">
<option value="None">None</option>
<option value="Disastrous">Disastrous</option>
<option value="Wretched">Wretched</option>
<option value="Poor">Poor</option>
<option value="Weak">Weak</option>
<option value="Inadequate">Inadequate</option>
<option value="Passable">Passable</option>
<option value="Solid">Solid</option>
<option value="Excellent">Excellent</option>
<option value="Formidable">Formidable</option>
<option value="Outstanding">Outstanding</option>
<option value="Brilliant">Brilliant</option>
<option value="Magnificent">Magnificent</option>
<option value="Worldclass">Worldclass</option>
<option value="Titanic">Titanic</option>
<option value="Extra-terres.">Extra-terres.</option>
<option value="Mythical">Mythical</option>
<option value="Magical">Magical</option>
<option value="Utopian">Utopian</option>
<option value="Divine">Divine</option>
</select>
<br/>
<div id="totalPrice"></div>
<h3>Train to skill level</h3>
<select id="Train to skill level" name='Train to skill level'
onchange="calculateTotal()">
<option value="None">None</option>
<option value="Disastrous">Disastrous</option>
<option value="Wretched">Wretched</option>
<option value="Poor">Poor</option>
<option value="Weak">Weak</option>
<option value="Inadequate">Inadequate</option>
<option value="Passable">Passable</option>
<option value="Solid">Solid</option>
<option value="Excellent">Excellent</option>
<option value="Formidable">Formidable</option>
<option value="Outstanding">Outstanding</option>
<option value="Brilliant">Brilliant</option>
<option value="Magnificent">Magnificent</option>
<option value="Worldclass">Worldclass</option>
<option value="Titanic">Titanic</option>
<option value="Extra-terres.">Extra-terres.</option>
<option value="Mythical">Mythical</option>
<option value="Magical">Magical</option>
<option value="Utopian">Utopian</option>
<option value="Divine">Divine</option>
</select>
<br/>
<div id="totalPrice"></div>
</fieldset>
</form>
<body>
</body>
</html>
De calculaties zijn uitgelegd in het text bestand wat is toegevoegd. Ik hoop dat jullie kunnen helpen. Alvast bedankt voor de moeite.
Met vriendelijk groet,
scorro