This code works in firefox perfectly, but in Internet Explorer it does not calculate the total correctly. Anybody know why?
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en" dir="ltr">
<head>
<title>Order form</title>
<style type="text/css">
@media screen {
body {
font: 100% sans-serif;
}
h1 {
font: 130% normal sans-serif;
text-align: center;
}
fieldset {
border-style: none;
margin: 0 0 1em;
padding: 0.5ex;
}
label {
display: block;
margin-left: 1em;
width: 12em;
}
legend {
font-weight: bold;
margin: 0;
padding: 0;
}
#order {
position: relative;
}
#total {
display: block;
margin-left: auto;
margin-right: auto;
width: 6em;
}
#total-group {
border-style: none;
text-align: center;
position: fixed;
right: 10%;
top: 20%;
width: 8em;
}
#total-group legend {
display: none;
}
#total-label {
margin-bottom: 0.75em;
margin-left: 0;
width: auto;
}
}
</style>
</head>
<body>
<h1>Computer A</h1>
<form id="order" action="" method="post">
<fieldset><legend>Processor</legend>
<label><input name="processor" type="radio" value="0" checked>
Default option</label>
<label><input name="processor" type="radio" value="50">
Upgrade 1 ($50.00)</label>
<label><input name="processor" type="radio" value="100">
Upgrade 2 ($100.00)</label>
</fieldset>
<fieldset><legend>Memory</legend>
<label><input name="memory" type="radio" value="0" checked>
Default option</label>
<label><input name="memory" type="radio" value="50">
Upgrade 1 ($50.00)</label>
<label><input name="memory" type="radio" value="100">
Upgrade 2 ($100.00)</label>
</fieldset>
<fieldset><legend>Hard Drive</legend>
<label><input name="hard-drive" type="radio" value="0" onClick="function()" checked>
Default option</label>
<label><input name="hard-drive" type="radio" value="50" onClick="function()">
Upgrade 1 ($50.00)</label>
<label><input name="hard-drive" type="radio" value="100">
Upgrade 2 ($100.00)</label>
</fieldset>
<fieldset id="total-group"><legend>Total</legend>
<label id="total-label">Your total:
<input id="total" type="text" value="$0.00"></label>
<input type="submit" value="Send">
<input type="reset" value="Reset">
</fieldset>
</form>
<script type="text/javascript">
Number.prototype.toCurrency = function(c, t, d) {
var n = +this,
s = (0 > n) ? '-' : '',
m = String(Math.round(Math.abs(n))),
i = '',
j, f;
c = c || '';
t = t || '';
d = d || '.';
while (m.length < 3) {m = '0' + m;}
f = m.substring((j = m.length - 2));
while (j > 3) {i = t + m.substring(j - 3, j) + i; j -= 3;}
i = m.substring(0, j) + i;
return s + c + i + d + f;
};
if(document.getElementsByName) {
(function() {
var E = document.forms.order.elements,
T = E.total;
function calculateTotal() {
var t = 0,
e, v;
if((e = getChecked('processor', this.form, 'radio'))) {t += +e.value;}
if((e = getChecked('memory', this.form, 'radio'))) {t += +e.value;}
if((e = getChecked('hard-drive', this.form, 'radio'))) {t += +e.value;}
T.value = (t * 100).toCurrency('$');
}
function getChecked(gN, f, t) {
var g = document.getElementsByName(gN);
t = t || 'checkbox';
for(var i = 0, n = g.length, c; i < n; ++i) {
if((t == (c = g[i]).type) && c.checked && (f == c.form)) {return c;}
}
}
for(var i = 0, n = E.length; i < n; ++i) {
if('radio' == E[i].type) {
E[i].onchange = calculateTotal;
}
}
E = null;
})();
}
</script>
</body>
</html>