strui013
11-26-2002, 08:39 AM
Hi people :) This is my first message on the board. I'm Johan Struijk, living in The Netherlands. I'm 20 years old and I'm a freelance PHP/MySQL coder :)
A few days ago I had to write a shopping cart for one of my clients, and I had to do this in javascript. Since I'm not so experienced in javascript it took me a whole day to write the cart. Also I got many errors. When I was done my client hold a presentation about the shop in front of about 200 people, but the cart didn't work. The cart crashed when my client tried to buy an item. Buying an item is very simple, the customer fills out the amount of items he wants, if the customer goes to another field the script calculates the costs. The formula for this is PRICE * AMOUNT * TAX.
So I asked my client which version of Explorer he uses, he use Explorer 5.0 . This is probably the problem. Could someone check the script below for me and tell me what I need to change so the script works in IE5.0 / IE4.0 ?
<script language="JavaScript">
buildPage();
function showRest()
{
document.all['artikels'].style.visibility = "visible";
document.all['selectKenmerk'].style.visibility = "hidden";
}
function buildPage()
{
document.write("<form name=\"formulier\" method=\"post\" action=\"confirmation.php\" onSubmit='return validateForm()'>");
document.write("<input type=\"hidden\" name=\"hiddenArtikel\">");
document.write("<input type=\"hidden\" name=\"hiddenAantal\">");
document.write("<input type=\"hidden\" name=\"hiddenSubtotaal\">");
document.write("<div ID=\"selectKenmerk\">");
document.write("<font face=\"Verdana\" size=\"2\">Selecteer eerst uw kenmerk:</font>");
document.write("<select name=\"kenmerk\" onChange=\"showRest()\">");
document.write("<option value=\"\">-selecteer-</option>");
document.write("<option value=\"0\">VAN lid</option>");
document.write("<option value=\"1\">Geen VAN lid</option>");
document.write("<option value=\"2\">Gemeente</option>");
document.write("</select>");
document.write("</div>");
document.write("<div ID=\"artikels\" style=\"visibility:hidden\">");
document.write("<br><br><TABLE border=1 width=\"100%\">")
document.write("<TBODY>");
document.write("<TR>");
document.write("<TD width=\"26%\"><B><font face=\"Verdana\" size=\"1\">Artikel</font></B></TD>");
document.write("<TD align=middle width=\"14%\"><font face=\"Verdana\" size=\"1\">prijs ");
document.write("leden</font></TD>");
document.write("<TD align=middle width=\"14%\"><font face=\"Verdana\" size=\"1\">Prijs niet ");
document.write("leden</font></TD>");
document.write("<TD align=middle width=\"15%\"><font face=\"Verdana\" size=\"1\">Prijs ");
document.write("gemeenten</font></TD>");
document.write("<TD align=middle width=\"13%\">");
document.write("<p align=\"left\"><font face=\"Verdana\" size=\"1\">Aantal</font></p>");
document.write("</TD>");
document.write("<TD align=middle width=\"34%\">");
document.write("<P align=left><font face=\"Verdana\" size=\"1\">SubTotaal</font></P></TD></TR>");
for (x = 0; x < artikels.length; x++)
{
document.write("<TR>");
document.write("<TD width=\"26%\"><font face=\"Verdana\" size=\"1\">");
document.write(artikels[x] + "</font></TD>");
document.write("<TD align=middle width=\"14%\">");
if (prijs_leden[x] == 0)
prijs_leden = "n.v.t.";
document.write("<font face=\"Verdana\" size=\"1\">" + prijs_leden[x]);
document.write("</font></TD>");
document.write("<TD align=middle width=\"14%\"><font face=\"Verdana\" size=\"1\">");
if (prijs_niet_leden[x] == 0)
prijs_niet_leden[x] = "n.v.t.";
document.write(prijs_niet_leden[x]);
document.write("</font></TD>");
document.write("<TD align=middle width=\"15%\"><font face=\"Verdana\" size=\"1\">");
if (prijs_gemeente[x] == 0)
prijs_gemeente[x] = "n.v.t.";
document.write(prijs_gemeente[x]);
document.write("</font></TD>");
document.write("<TD align=left width=\"13%\">");
document.write("<P align=left><font face=\"Verdana\" size=\"1\">");
document.write("<INPUT name=num" + x + " size=8 onChange=\"");
document.write("getInfo(" + x + ")\"></font></P></TD>");
document.write("<TD align=left width=\"34%\">");
document.write("<P align=left><font face=\"Verdana\" size=\"1\">");
document.write("<INPUT name=sub" + x + " size=14></font></P></TD></TR>");
document.write("<TR>");
}
document.write("<TR>");
document.write("<TD> </TD><TD> </TD><TD> </TD><TD> </TD><TD>")
document.write("<b>Totaal</b>");
document.write("</TD><TD><INPUT type=\"text\" name=\"totaal\" value=\"\"></TD></TR></TABLE>")
document.write("<br><br><TABLE border=1 width=\"65%\"");
document.write("<TBODY>");
document.write("<TR>");
document.write("<TD width=\"22%\">");
document.write("<P align=right><font face=\"Verdana\" size=\"1\">Naam:</font></P></TD>");
document.write("<TD width=\"78%\"><font face=\"Verdana\" size=\"1\">");
document.write("<INPUT name=naam size=38></font></TD></TR>");
document.write("<TR>");
document.write("<TD width=\"22%\">");
document.write("<P align=right><font face=\"Verdana\" size=\"1\">Bedrijf / Gemeente:</font></P></TD>");
document.write("<TD width=\"78%\"><font face=\"Verdana\" size=\"1\">");
document.write("<INPUT name=gemeente size=38></font></TD></TR>");
document.write("<TR>");
document.write("<TD width=\"22%\">");
document.write("<P align=right><font face=\"Verdana\" size=\"1\">Afleveradres:</font></P></TD>");
document.write("<TD width=\"78%\"><font face=\"Verdana\" size=\"1\">");
document.write("<INPUT name=afleveradres size=38></font></TD></TR>");
document.write("<TR>");
document.write("<TD width=\"22%\">");
document.write("<P align=right><font face=\"Verdana\" size=\"1\">Factuuradres:</font></P></TD>");
document.write("<TD width=\"78%\"><font face=\"Verdana\" size=\"1\">");
document.write("<INPUT name=factuuradres size=38></font></TD></TR>");
document.write("<TR>");
document.write("<TD width=\"22%\">");
document.write("<P align=right><font face=\"Verdana\" size=\"1\">Emailadres:</font></P></TD>");
document.write("<TD width=\"78%\"><font face=\"Verdana\" size=\"1\">");
document.write("<INPUT name=email_koper size=38></font></TD></TR>");
document.write("</TBODY></TABLE>");
document.write("<P><font face=\"Verdana\" size=\"1\"><INPUT name=B1 type=submit ");
document.write("value=Verzenden onClick=\"addToHidden();\">");
document.write("<INPUT name=B2 type=reset value=\"Invoer wissen\">");
document.write("</font></P>");
document.write("</form>");
document.write("</div>");
}
function custRound(x,places) {
return (Math.round(x*Math.pow(10,places)))/Math.pow(10,places)
}
function addToHidden()
{
for (x = 0; x < AANTAL; x++)
{
var num = "num" + x;
if (document.formulier.elements[num].value > 0)
{
var artikel = document.formulier.elements['hiddenArtikel'];
var aantal = document.formulier.elements['hiddenAantal'];
var subtotaal = document.formulier.elements['hiddenSubtotaal'];
var sub2 = "sub" + x;
artikel.value += artikels[x] + "|";
aantal.value += document.formulier.elements[num].value + "|";
subtotaal.value += document.formulier.elements[sub2].value + "|";
}
}
}
function calculateTotal()
{
var total = 0;
for (x = 0; x < AANTAL; x++)
{
sub = "sub" + x;
if (document.formulier.elements[sub].value != "")
{
var val = parseFloat(document.formulier.elements[sub].value);
total = total + val;
}
}
document.formulier.elements['totaal'].value = custRound(total,2);
}
function getInfo(ID) {
kenmerk = document.formulier.kenmerk.value;
if (kenmerk == 0)
prijs = prijs_leden[ID];
if (kenmerk == 1)
prijs = prijs_niet_leden[ID];
if (kenmerk == 2)
prijs = prijs_gemeente[ID];
if (prijs != "n.v.t.")
{
num = "num" + ID;
num = document.formulier.elements[num].value;
prijs = custRound(prijs,2);
BTW = prijs * (btw[ID] / 100);
prijs = num * (prijs + BTW);
prijs = custRound(prijs,2);
sub = 'sub' + ID;
document.formulier.elements[sub].value = prijs;
calculateTotal();
} else if (prijs == "n.v.t.")
{
alert("Helaas, u kunt dit artikel niet bestellen.");
num = 'num' + ID;
document.formulier.elements[num].value = "";
}
}
</script>
A few days ago I had to write a shopping cart for one of my clients, and I had to do this in javascript. Since I'm not so experienced in javascript it took me a whole day to write the cart. Also I got many errors. When I was done my client hold a presentation about the shop in front of about 200 people, but the cart didn't work. The cart crashed when my client tried to buy an item. Buying an item is very simple, the customer fills out the amount of items he wants, if the customer goes to another field the script calculates the costs. The formula for this is PRICE * AMOUNT * TAX.
So I asked my client which version of Explorer he uses, he use Explorer 5.0 . This is probably the problem. Could someone check the script below for me and tell me what I need to change so the script works in IE5.0 / IE4.0 ?
<script language="JavaScript">
buildPage();
function showRest()
{
document.all['artikels'].style.visibility = "visible";
document.all['selectKenmerk'].style.visibility = "hidden";
}
function buildPage()
{
document.write("<form name=\"formulier\" method=\"post\" action=\"confirmation.php\" onSubmit='return validateForm()'>");
document.write("<input type=\"hidden\" name=\"hiddenArtikel\">");
document.write("<input type=\"hidden\" name=\"hiddenAantal\">");
document.write("<input type=\"hidden\" name=\"hiddenSubtotaal\">");
document.write("<div ID=\"selectKenmerk\">");
document.write("<font face=\"Verdana\" size=\"2\">Selecteer eerst uw kenmerk:</font>");
document.write("<select name=\"kenmerk\" onChange=\"showRest()\">");
document.write("<option value=\"\">-selecteer-</option>");
document.write("<option value=\"0\">VAN lid</option>");
document.write("<option value=\"1\">Geen VAN lid</option>");
document.write("<option value=\"2\">Gemeente</option>");
document.write("</select>");
document.write("</div>");
document.write("<div ID=\"artikels\" style=\"visibility:hidden\">");
document.write("<br><br><TABLE border=1 width=\"100%\">")
document.write("<TBODY>");
document.write("<TR>");
document.write("<TD width=\"26%\"><B><font face=\"Verdana\" size=\"1\">Artikel</font></B></TD>");
document.write("<TD align=middle width=\"14%\"><font face=\"Verdana\" size=\"1\">prijs ");
document.write("leden</font></TD>");
document.write("<TD align=middle width=\"14%\"><font face=\"Verdana\" size=\"1\">Prijs niet ");
document.write("leden</font></TD>");
document.write("<TD align=middle width=\"15%\"><font face=\"Verdana\" size=\"1\">Prijs ");
document.write("gemeenten</font></TD>");
document.write("<TD align=middle width=\"13%\">");
document.write("<p align=\"left\"><font face=\"Verdana\" size=\"1\">Aantal</font></p>");
document.write("</TD>");
document.write("<TD align=middle width=\"34%\">");
document.write("<P align=left><font face=\"Verdana\" size=\"1\">SubTotaal</font></P></TD></TR>");
for (x = 0; x < artikels.length; x++)
{
document.write("<TR>");
document.write("<TD width=\"26%\"><font face=\"Verdana\" size=\"1\">");
document.write(artikels[x] + "</font></TD>");
document.write("<TD align=middle width=\"14%\">");
if (prijs_leden[x] == 0)
prijs_leden = "n.v.t.";
document.write("<font face=\"Verdana\" size=\"1\">" + prijs_leden[x]);
document.write("</font></TD>");
document.write("<TD align=middle width=\"14%\"><font face=\"Verdana\" size=\"1\">");
if (prijs_niet_leden[x] == 0)
prijs_niet_leden[x] = "n.v.t.";
document.write(prijs_niet_leden[x]);
document.write("</font></TD>");
document.write("<TD align=middle width=\"15%\"><font face=\"Verdana\" size=\"1\">");
if (prijs_gemeente[x] == 0)
prijs_gemeente[x] = "n.v.t.";
document.write(prijs_gemeente[x]);
document.write("</font></TD>");
document.write("<TD align=left width=\"13%\">");
document.write("<P align=left><font face=\"Verdana\" size=\"1\">");
document.write("<INPUT name=num" + x + " size=8 onChange=\"");
document.write("getInfo(" + x + ")\"></font></P></TD>");
document.write("<TD align=left width=\"34%\">");
document.write("<P align=left><font face=\"Verdana\" size=\"1\">");
document.write("<INPUT name=sub" + x + " size=14></font></P></TD></TR>");
document.write("<TR>");
}
document.write("<TR>");
document.write("<TD> </TD><TD> </TD><TD> </TD><TD> </TD><TD>")
document.write("<b>Totaal</b>");
document.write("</TD><TD><INPUT type=\"text\" name=\"totaal\" value=\"\"></TD></TR></TABLE>")
document.write("<br><br><TABLE border=1 width=\"65%\"");
document.write("<TBODY>");
document.write("<TR>");
document.write("<TD width=\"22%\">");
document.write("<P align=right><font face=\"Verdana\" size=\"1\">Naam:</font></P></TD>");
document.write("<TD width=\"78%\"><font face=\"Verdana\" size=\"1\">");
document.write("<INPUT name=naam size=38></font></TD></TR>");
document.write("<TR>");
document.write("<TD width=\"22%\">");
document.write("<P align=right><font face=\"Verdana\" size=\"1\">Bedrijf / Gemeente:</font></P></TD>");
document.write("<TD width=\"78%\"><font face=\"Verdana\" size=\"1\">");
document.write("<INPUT name=gemeente size=38></font></TD></TR>");
document.write("<TR>");
document.write("<TD width=\"22%\">");
document.write("<P align=right><font face=\"Verdana\" size=\"1\">Afleveradres:</font></P></TD>");
document.write("<TD width=\"78%\"><font face=\"Verdana\" size=\"1\">");
document.write("<INPUT name=afleveradres size=38></font></TD></TR>");
document.write("<TR>");
document.write("<TD width=\"22%\">");
document.write("<P align=right><font face=\"Verdana\" size=\"1\">Factuuradres:</font></P></TD>");
document.write("<TD width=\"78%\"><font face=\"Verdana\" size=\"1\">");
document.write("<INPUT name=factuuradres size=38></font></TD></TR>");
document.write("<TR>");
document.write("<TD width=\"22%\">");
document.write("<P align=right><font face=\"Verdana\" size=\"1\">Emailadres:</font></P></TD>");
document.write("<TD width=\"78%\"><font face=\"Verdana\" size=\"1\">");
document.write("<INPUT name=email_koper size=38></font></TD></TR>");
document.write("</TBODY></TABLE>");
document.write("<P><font face=\"Verdana\" size=\"1\"><INPUT name=B1 type=submit ");
document.write("value=Verzenden onClick=\"addToHidden();\">");
document.write("<INPUT name=B2 type=reset value=\"Invoer wissen\">");
document.write("</font></P>");
document.write("</form>");
document.write("</div>");
}
function custRound(x,places) {
return (Math.round(x*Math.pow(10,places)))/Math.pow(10,places)
}
function addToHidden()
{
for (x = 0; x < AANTAL; x++)
{
var num = "num" + x;
if (document.formulier.elements[num].value > 0)
{
var artikel = document.formulier.elements['hiddenArtikel'];
var aantal = document.formulier.elements['hiddenAantal'];
var subtotaal = document.formulier.elements['hiddenSubtotaal'];
var sub2 = "sub" + x;
artikel.value += artikels[x] + "|";
aantal.value += document.formulier.elements[num].value + "|";
subtotaal.value += document.formulier.elements[sub2].value + "|";
}
}
}
function calculateTotal()
{
var total = 0;
for (x = 0; x < AANTAL; x++)
{
sub = "sub" + x;
if (document.formulier.elements[sub].value != "")
{
var val = parseFloat(document.formulier.elements[sub].value);
total = total + val;
}
}
document.formulier.elements['totaal'].value = custRound(total,2);
}
function getInfo(ID) {
kenmerk = document.formulier.kenmerk.value;
if (kenmerk == 0)
prijs = prijs_leden[ID];
if (kenmerk == 1)
prijs = prijs_niet_leden[ID];
if (kenmerk == 2)
prijs = prijs_gemeente[ID];
if (prijs != "n.v.t.")
{
num = "num" + ID;
num = document.formulier.elements[num].value;
prijs = custRound(prijs,2);
BTW = prijs * (btw[ID] / 100);
prijs = num * (prijs + BTW);
prijs = custRound(prijs,2);
sub = 'sub' + ID;
document.formulier.elements[sub].value = prijs;
calculateTotal();
} else if (prijs == "n.v.t.")
{
alert("Helaas, u kunt dit artikel niet bestellen.");
num = 'num' + ID;
document.formulier.elements[num].value = "";
}
}
</script>