help with this code

@j_doweMar 17.2006

hello, i need help using ~~[U]~~~~[B]~~javascript[/B].[/U] i have pasted a piece of code but cant get the calculations to work. i would b greatful if someone can help. thanks. i need the album price to appear in txt box and i need to add on the delivery price to the total, wen selected.

<html>

function CalcTotal()
{
costAlbum1=10.00
costAlbum2=11.00
costAlbum3=12.00
costAlbum4=13.00

Album1 = document.frmprod.Album1.selectedIndex
Album2 = document.frmprod.Album2.selectedIndex
Album3 = document.frmprod.Album3.selectedIndex
Album4 = document.frmprod.Album4.selectedIndex

totalAlbum1=Album1*costAlbum1
totalAlbum2=Album2*costAlbum2
totalAlbum3=Album3*costAlbum3
totalAlbum4=Album4*costAlbum4

total=totalAlbum1+totalAlbum2+totalAlbum3+totalAlbum4
frmprod.total.value = total
}

</SCRIPT>
<body>

<form method=”POST” action=”–WEBBOT-SELF–“>
<!–webbot bot=”SaveResults” U-File=”E:ecommerce_privateform_results.csv” S-Format=”TEXT/CSV” S-Label-Fields=”TRUE” –>
<p><font size=”4″>Album1 </font>             
<select size=”1″ name=”Album1″>
<option>0</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
</select>    £10.00</p>

<p> </p> <p><font size=”4″>Album2</font>                <select size=”1″ name=”Album2″> <option>0</option> <option>1</option> <option>2</option> <option>3</option> <option>4</option> </select>    £11.00</p>

<p> </p> <p><font size=”4″>Album3</font>                <select size=”1″ name=”Album3″> <option>0</option> <option>1</option> <option>2</option> <option>3</option> <option>4</option> </select>    £12.00</p>

<p> </p> <p><font size=”4″>Album4   </font>             <select size=”1″ name=”Album4″> <option>0</option> <option>1</option> <option>2</option> <option>3</option> <option>4</option> </select>    £13.00</p> <p> </p> <p> </p> <fieldset style=”padding: 2″> <legend>Delivery</legend> Next Day Delivery 10%<input type=”radio” value=”V4″ checked name=”R1″><p> First Class £3<input type=”radio” name=”R1″ value=”V5″></p> <p>Second Class £1<input type=”radio” name=”R1″ value=”V6″></p> <p> </p> </fieldset><p> <input onFocus=”this.blur()” name=”total” size=”20″></p> <p><input type=”submit” value=”Submit” name=”B9″><input type=”reset” value=”Reset” name=”B10″></p> <p> </p>

</form>

</body>

</html>

to post a comment

JavaScript

4 Comments(s) _↴

@Tweak4Mar 17.2006 — #There are 2 problems I spotted right off the bat:

- You keep refering to document.frmprod in your function, but it doesn't exist anywhere in your code. Add a name="frmprod" attribute to your form tag, and

- Nothing in the page actually kicks off your function. If you add onChange="CalcTotal()" to each of your select tags, it will update the total any time something is selected from one of the lists.

Of course, this doesn't take your Delivery options into account, but the logic you'll need is pretty much the same...

@j_doweauthorMar 17.2006 — #cheers mate for your help. you think you can implement ur ideas to make this a working webpage. i would b greatful if ya could. i dont think its hard but, a bit tricky. maybe i just started javascript

@James_GatkaMar 17.2006 — #

[CODE]<html>
 <head>
 <script type="text/javascript">
 
  function calc(nForm){
 
   var tmp1 = nForm['Album1'].selectedIndex * 10;
   var tmp2 = nForm['Album2'].selectedIndex * 11;
   var tmp3 = nForm['Album3'].selectedIndex * 12;
   var tmp4 = nForm['Album4'].selectedIndex * 13;
   if (nForm['R1'][0].checked){var delivery = 10}
   else if (nForm['R1'][1].checked){var delivery = 3}
   else if (nForm['R1'][2].checked){var delivery = 1}
   var nTotal = tmp1 + tmp2 + tmp3 + tmp4;
   if (nTotal > 0 ){nTotal = nTotal + Number(delivery)}
   nForm['total'].value = nTotal.toFixed(2);
  }
 
 </script>
 </head>
 <body>
 
 <form>
 <fieldset style="width:250px;padding:2px">
 <legend>Order</legend>
 <p><font size="4">Album1 </font>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;
 <select size="1" name="Album1" onchange="calc(this.form)">
 <option>0</option>
 <option>1</option>
 <option>2</option>
 <option>3</option>
 <option>4</option>
 </select>&nbsp;&nbsp;&nbsp; £10.00</p>
 
 <p>&nbsp;</p>
 <p><font size="4">Album2</font>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
 <select size="1" name="Album2" onchange="calc(this.form)">
 <option>0</option>
 <option>1</option>
 <option>2</option>
 <option>3</option>
 <option>4</option>
 </select>&nbsp;&nbsp;&nbsp; £11.00</p>
 
 <p>&nbsp;</p>
 <p><font size="4">Album3</font>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;
 <select size="1" name="Album3" onchange="calc(this.form)">
 <option>0</option>
 <option>1</option>
 <option>2</option>
 <option>3</option>
 <option>4</option>
 </select>&nbsp;&nbsp;&nbsp; £12.00</p>
 
 <p>&nbsp;</p>
 <p><font size="4">Album4&nbsp;&nbsp;&nbsp;</font>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
 <select size="1" name="Album4" onchange="calc(this.form)">
 <option>0</option>
 <option>1</option>
 <option>2</option>
 <option>3</option>
 <option>4</option>
 </select>&nbsp;&nbsp;&nbsp; £13.00</p>
 <p>&nbsp;</p>
 <p>&nbsp;</p>
 
 Next Day Delivery £10<input type="radio" checked name="R1" onclick="calc(this.form)"><p>
 First Class £3<input type="radio" name="R1" onclick="calc(this.form)"></p>
 <p>Second Class £1<input type="radio" name="R1" onclick="calc(this.form)"></p>
 <p>&nbsp;</p>
 
 £<input type="text" name="total" size="10" value="0.00" readonly></p>
 <p><input type="submit" name="B9" value="Submit" >&nbsp<input type="reset" name="B10" value="Reset" ></p>
 <p>&nbsp;</p>
 </fieldset><p>
 </form>
 
 </body>
 </html>[/CODE]

@j_doweauthorMar 20.2006 — #hey there, thanks for the code it really helped me, but one thing i need a bit more assistance is how to change £10 delivery, into 10% of total price!!!!

Also in #JavaScript _↴

Differences In Textarea Values simple browser detection ??How to get JS debugging messages

Success!

Help @j_dowe spread the word by sharing this article on Twitter...

Tweet This

help with this code

4 Comments(s) _↴

Also in #JavaScript _↴

Success!

Social

Version

help with this code

4 Comments(s) ↴

Also in #JavaScript ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

4 Comments(s) _↴

Also in #JavaScript _↴