need a simple bit of javascript

Associate
Joined
25 Feb 2008
Posts
28
Would anybody like to come up with a bit of a script for me. All i want is a simple script that will add 3 items in a form and dynamically change the price as the user makes their selection. At the begining of the calculations a base price needs to be added (used as as the starting price for the user)

Example

- Base Price £400 (price that will show in the total box at the start)

- Radio Buttons 1 <option1(£10)> <option2(£20)> <option3(£30)>

- Radio Buttons 2 <option1(£50)> <option2(£100)> <option3(£150)>

- Radio Buttons 3 <option1(£1)> <option2(£2)> <option3(£3)>

- Total (Changes as user makes each choice)


Thanks
 
Try this, may be a better way of doing it but this works.

Code:
<html> 
	<head>
		<title>JavaScript Test</title>
		<script type="text/javascript">
	
			function doTotal(form) {
				var total = 400;
				
				for (var i=0; i < form.elements.length; i++) {
					var element = form.elements[i];
					if (element.checked) {
						total += parseInt(element.value);
					}
				}
				form.total.value = total;
			}
			
		</script>
	</head>
	<body>
	<form action="">
		<input type="radio" name="cat1" value="10" onclick="doTotal(this.form)" />Option1 (£10)<br />
		<input type="radio" name="cat1" value="20" onclick="doTotal(this.form)" />Option2 (£20)<br />
		<input type="radio" name="cat1" value="30" onclick="doTotal(this.form)" />Option3 (£30)<br />
		<br />
		<input type="radio" name="cat2" value="50" onclick="doTotal(this.form)" />Option1 (£50)<br />
		<input type="radio" name="cat2" value="100" onclick="doTotal(this.form)" />Option2 (£100)<br />
		<input type="radio" name="cat2" value="150" onclick="doTotal(this.form)" />Option3 (£150)<br />
		<br />
		<input type="radio" name="cat3" value="1" onclick="doTotal(this.form)" />Option1 (£1)<br />
		<input type="radio" name="cat3" value="2" onclick="doTotal(this.form)" />Option2 (£2)<br />
		<input type="radio" name="cat3" value="3" onclick="doTotal(this.form)" />Option3 (£3)<br />
		<br />
		Total: <input type="text" name="total" value="" readonly="readonly" size="4" />
	</form>
	</body>
</html>
 
Back
Top Bottom