Orderform help javascript
Hello,
I have been trying to create a order form for thr last 2 weeks and i keep hitting brick walls. Below is the program i am working on currently when a checkbox is checked goods will be put into the cart however i want this to change. When a figure from the drop down list is selected the cart should say the product name, number of goods selected and the price of goods.
[php]<HTML>
<HEAD>
<link rel = "stylesheet"
HREF=./Style.css Type=text/css>
<SCRIPT LANGUAGE=JavaScript><!--
function update(){
with (document.storeform){
var contents, total_price,total_items,i1,i2;
contents="";
total_price=0;
total_items=0;
i1=parseFloat(item1.value);
i2=parseFloat(item2.value);
if (item1.checked){
contents="Whippersnapper: €"+i1+"\r";
total_price=total_price+i1;
total_items=total_items+1;
}
if (item2.checked){
contents=contents+"Owens Brown: €"+i2+"\r";
total_price=total_price+i2;
total_items=total_items+1;
}
display.value="Number of Items selected: "+ total_items +
"\r"+ contents + "______________________\rTOTAL BILL: €" + total_price;
}
}
//--></SCRIPT>
</HEAD>
<BODY BGCOLOR="#0069EF">
<P><FORM name=storeform>
<P><TABLE BORDER=2 WIDTH=100%>
<TR>
<TD COLSPAN=2 WIDTH=400>
<P>Choose as many of the following items as you
like, and click the button to update your shopping cart.
</TD>
</TR>
<TR>
<TD WIDTH=200>
<P>Product List
</TR>
<TR>
<TD WIDTH=200>
<P>Whippersnapper
</TD>
<TD WIDTH=200>
<P><INPUT TYPE=checkbox NAME=item1 VALUE=2.00>
<select name=productQuality size=1>
<option value=1>1
<option value=2>2
<option value=3>3
<option value=4>4
</select>
</TD>
</TR>
<TR>
<TD WIDTH=200>
<P>Owens Brown
</TD>
<TD WIDTH=400>
<P><INPUT TYPE=checkbox NAME=item2 VALUE=2.50 >
<select name=productQuality size=1>
<option value=1>1
<option value=2>2
<option value=3>3
<option value=4>4
</select>
</TD>
</TR>
<TR>
<TD>
<P><INPUT TYPE=button VALUE="Update Cart" onclick="update()"> <TD> <INPUT TYPE=reset VALUE="Clear Cart">
</TD>
</TR>
<TR>
<TD COLSPAN=2 WIDTH=200>
<P><TEXTAREA NAME=display ROWS=7 COLS=30 <Comic Sana Ms>>Have a nice Day!</TEXTAREA>
</TD>
</TR>
<P><a href="Company2.html"><li>Home</li></a></p>
</TABLE>
</FORM>
</BODY>
</HTML>[/php]Last week NotMe and Daymobrew helped me and this is what was achieved (below). But since then i have tried for hours unend trying to put this functionality in the top program. Can anyone help
[php]<html><head>
<script type="text/javascript">
function testFunction() {
var productPrice1= 2.50
var productPrice2= 3.90
var prodQuantity = document.getElementById("productQuantity").value;
var x1 = prodQuantity * productPrice1;
document.getElementById("result1").value = x1;
var prodQuantity2 = document.getElementById("productQuantity2").value;
var x2 = prodQuantity2 * productPrice2;
document.getElementById("result2").value = x2;
}
function updateTotal()
{
var totalPrice = document.getElementById("totalPrice").value;
var tp1 = x1+x2+x3+x4+x5+x6;
document.getElementById("resultTotal").value = tp1;
}
</script></head><body>
<select onchange="testFunction()" id="productQuantity" size="1">
<option>0
</option><option>1
</option><option>2
</option><option>3
</option><option>4
</option></select>
<br><br>
<select onchange="testFunction()" id="productQuantity2" size="1">
<option>0
</option><option>1
</option><option>2
</option><option>3
</option><option>4
</option></select>
<br><br>
The cost of product 1 is <input id="result1" value="0" type="text">
<br><br>
The cost of product 2 is <input id="result2" value="0" type="text">
<br><br>
<p><input value="Total" onclick="updateTotal()" type="button">
<br><br>
The total cost is <input id="resultTotal" value="0" type="text">
</p></body><script type="text/javascript"><!--
function __RP_Callback_Helper(str, strCallbackEvent, splitSize, func){var event = null;if (strCallbackEvent){event = document.createEvent('Events');event.initEvent(strCallbackEvent, true, true);}if (str && str.length > 0){var splitList = str.split('|');var strCompare = str;if (splitList.length == splitSize)strCompare = splitList[splitSize-1];var pluginList = document.plugins;for (var count = 0; count < pluginList.length; count++){var sSrc = '';if (pluginList[count] && pluginList[count].src)sSrc = pluginList[count].src;if (strCompare.length >= sSrc.length){if (strCompare.indexOf(sSrc) != -1){func(str, count, pluginList, splitList);break;}}}}if (strCallbackEvent)document.body.dispatchEvent(event);}function __RP_Coord_Callback(str){var func = function(str, index, pluginList, splitList){pluginList[index].__RP_Coord_Callback = str;pluginList[index].__RP_Coord_Callback_Left = splitList[0];pluginList[index].__RP_Coord_Callback_Top = splitList[1];pluginList[index].__RP_Coord_Callback_Right = splitList[2];pluginList[index].__RP_Coord_Callback_Bottom = splitList[3];};__RP_Callback_Helper(str, 'rp-js-coord-callback', 5, func);}function __RP_Url_Callback(str){var func = function(str, index, pluginList, splitList){pluginList[index].__RP_Url_Callback = str;pluginList[index].__RP_Url_Callback_Vid = splitList[0];pluginList[index].__RP_Url_Callback_Parent = splitList[1];};__RP_Callback_Helper(str, 'rp-js-url-callback', 3, func);}function __RP_TotalBytes_Callback(str){var func = function(str, index, pluginList, splitList){pluginList[index].__RP_TotalBytes_Callback = str;pluginList[index].__RP_TotalBytes_Callback_Bytes = splitList[0];};__RP_Callback_Helper(str, null, 2, func);}function __RP_Connection_Callback(str){var func = function(str, index, pluginList, splitList){pluginList[index].__RP_Connection_Callback = str;pluginList[index].__RP_Connection_Callback_Url = splitList[0];};__RP_Callback_Helper(str, null, 2, func);}
//--></script></html>[/php]