Results 1 to 3 of 3

Thread: html form help

  1. #1
    Join Date
    Jan 2013
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default html form help

    i have a simple html form that i created. I am wanting to edit the fields where you enter the number to drop down's. I am wanting to do this to limit the numbers which can be entered. another thing that i would like to do is add another drop down at the top of the form that would list the model's, with the models there would be 2 different entries for it (one being 2.6 the other being 2.7) the equation in the form goes as (spur / pinion * (here is where the model's drop down would be displayed as 2.6 or 2.7 depending on model selected))

    here is the current code i am using and wanting to change up, any help would be great (note, the form works right now, but wanting to add the above options to make it more friendly and easier)

    Code:
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="utf-8" />
    </head>
    
    <body>
    <form id="gearing" action="">
    <fieldset>
    	<legend><b>1/36 Scale</b> Final Gear Ratio</legend>
    	<p>
    		<label for="Pinion">Pinion</label>
    		<input id="pinion" name="pinion" />
    
    
    
    
    </br><b>Select 8-14 or 17</b>
    	</p>
    	<p>
    		<label for="spur">Spur</label>
    		<input id="spur" name="spur" />
    </br><b>Select 53-59</b>
    	</p>
    	<p>
    		<input type="submit" value="Submit" />
    		or
    		<input type="reset" value="Reset" />
    	</p>
    	<p>
    		<label for="weight">Result</label>
    		<input id="result" name="weight" />
    	</p>
    </fieldset>
    </form>
    
    <script>
    (function () {
    	function calculateGearing(pinion, spur) {
    		pinion = parseFloat(pinion);
    		spur = 
    parseFloat(spur);
    		return (spur / pinion * 2.7);
    	}
    
    	var gearing = document.getElementById("gearing");
    	if (gearing) {
    		gearing.onsubmit = function () {
    			this.weight.value = calculateGearing(this.pinion.value, this.spur.value);
    			return false;
    		};
    	}
    }());
    </script>
    </body>
    </html>

  2. #2
    Join Date
    May 2012
    Location
    Hitchhiking the Galaxy
    Posts
    1,013
    Thanks
    46
    Thanked 139 Times in 139 Posts
    Blog Entries
    1

    Default

    I'm pretty sure I know what you mean in terms of dropdowns:
    HTML Code:
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="utf-8" />
    </head>
    
    <body>
    <form id="gearing" action="">
    <fieldset>
    	<legend><b>1/36 Scale</b> Final Gear Ratio</legend>
    	<p>
    		<label for="Pinion">Pinion</label>
                    <select id="Pinion" name="Pinion">
                         <option value="2.6">2.6</option>
                         <option value="2.7">2.7</option>
                    </select>
    
    </br><b>Select 8-14 or 17</b>
    	</p>
    	<p>
    		<label for="spur">Spur</label>
    		<select id="spur" name="spur">
                         <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="17">17</option>
                    </select>
    </br><b>Select 53-59</b>
    	</p>
    	<p>
    		<input type="submit" value="Submit" />
    		or
    		<input type="reset" value="Reset" />
    	</p>
    	<p>
    		<label for="weight">Result</label>
    		<input id="result" name="weight" />
    	</p>
    </fieldset>
    </form>
    
    <script>
    (function () {
    	function calculateGearing(pinion, spur) {
    		pinion = parseFloat(pinion);
    		spur = 
    parseFloat(spur);
    		return (spur / pinion * 2.7);
    	}
    
    	var gearing = document.getElementById("gearing");
    	if (gearing) {
    		gearing.onsubmit = function () {
    			this.weight.value = calculateGearing(this.Pinion.value, this.spur.value);
    			return false;
    		};
    	}
    }());
    </script>
    </body>
    </html>
    I'm not sure this is exactly what you want however.
    "Most good programmers do programming not because they expect to get paid or get adulation by the public, but because it is fun to program." - Linus Torvalds
    Anime Views Forums
    Bernie

  3. #3
    Join Date
    Jan 2013
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks, I actually got it figured out. Click here to see it in action. It was something like what you just listed, i messed with it that way for awhile then found where I was missing. the script was this:

    Code:
    <script>
    (function () {
    	function calculateGearing(pinion, spur) {
    		pinion = parseFloat(pinion);
    		spur = 
    parseFloat(spur);
    		return (spur / pinion * 2.7);
    	}
    
    	var gearing = document.getElementById("gearing");
    	if (gearing) {
    		gearing.onsubmit = function () {
    			this.weight.value = calculateGearing(this.Pinion.value, this.spur.value);
    			return false;
    		};
    	}
    }());
    </script>
    and needed to be:

    Code:
    <script>
    (function () {
    	function calculateGearing(model, pinion, spur) {
    		model = 
    parseFloat(model); 
                    pinion = parseFloat(pinion);
    		spur = 
    parseFloat(spur);
                    
    		return (spur / pinion * model);
    	}
    
    	var gearing = document.getElementById("gearing");
    	if (gearing) {
    		gearing.onsubmit = function () {
    			this.weight.value = calculateGearing(this.model.value, this.pinion.value, this.spur.value );
    			return false;
    		};
    	}
    }());
    </script>

Similar Threads

  1. using an HTML form
    By bosun_ng in forum PHP
    Replies: 8
    Last Post: 06-03-2010, 10:01 PM
  2. html form to php email form
    By weiner769 in forum PHP
    Replies: 15
    Last Post: 02-05-2010, 06:26 PM
  3. HTML/PHP Form 2
    By kaos in forum Looking for such a script or service
    Replies: 5
    Last Post: 09-07-2009, 06:00 PM
  4. Replies: 0
    Last Post: 05-24-2008, 09:53 PM
  5. message form/feedback form html code
    By hyebaragi in forum Looking for such a script or service
    Replies: 1
    Last Post: 08-11-2007, 01:30 AM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •