HTML-Kodu:
<!-- THREE STEPS TO INSTALL ORDER FORM:
1. Copy the coding into the HEAD of your HTML document
2. Add the onLoad event handler into the BODY tag
3. Put the last coding into the BODY of your HTML document --> <!-- STEP ONE: Paste this code into the HEAD of your HTML document --> <HEAD> <SCRIPT LANGUAGE="JavaScript"> <!-- This script and many more are available free online at --> <!-- The JavaScript Source!! http://javascript.internet.com --> <!-- Original: Paul DeBrino --> <!-- Web Site: http://infinity-rd.com --> <!-- Begin
function CheckChoice(whichbox)
{
with (whichbox.form)
{
//Handle differently, depending on type of input box.
if (whichbox.type == "radio")
{
//First, back out the prior radio selection's price from the total:
hiddentotal.value = eval(hiddentotal.value) - eval(hiddenpriorradio.value);
//Then, save the current radio selection's price:
hiddenpriorradio.value = eval(whichbox.price);
//Now, apply the current radio selection's price to the total:
hiddentotal.value = eval(hiddentotal.value) + eval(whichbox.price);
}
else
{
//If box was checked, accumulate the checkbox value as the form total,
//Otherwise, reduce the form total by the checkbox value:
if (whichbox.checked == false)
{ hiddentotal.value = eval(hiddentotal.value) - eval(whichbox.value); }
else { hiddentotal.value = eval(hiddentotal.value) + eval(whichbox.value); }
}
//Ensure the total never goes negative (some browsers allow radiobutton to be deselected):
if (hiddentotal.value < 0)
{
InitForm();
}
//Now, return with formatted total:
return(formatCurrency(hiddentotal.value));
}
}
//Define function to format a value as currency:
function formatCurrency(num)
{
// Courtesy of http://www7.brinkster.com/cyanide7/
num = num.toString().replace(/\$|\,/g,'');
if(isNaN(num))
num = "0";
sign = (num == (num = Math.abs(num)));
num = Math.floor(num*100+0.50000000001);
cents = num%100;
num = Math.floor(num/100).toString();
if(cents<10)
cents = "0" + cents;
for (var i = 0; i < Math.floor((num.length-(1+i))/3); i++)
num = num.substring(0,num.length-(4*i+3))+','+
num.substring(num.length-(4*i+3));
return (((sign)?'':'-') + '$' + num + '.' + cents);
}
//Define function to init the form on reload:
function InitForm()
{
//Reset the displayed total on form:
document.myform.total.value='$0';
document.myform.hiddentotal.value=0;
document.myform.hiddenpriorradio.value=0;
document.myform2.total.value='$0';
document.myform2.hiddentotal.value=0;
document.myform2.hiddenpriorradio.value=0;
document.myform2.hiddenpriorradio.value=0;
//Set all checkboxes and radio buttons on form-1 to unchecked:
for (xx=0; xx < document.myform.elements.length; xx++)
{
if (document.myform.elements[xx].type == 'checkbox' | document.myform.elements[xx].type == 'radio')
{
document.myform.elements[xx].checked = false;
}
}
//Set all checkboxes and radio buttons on form-2 to unchecked:
for (xx=0; xx < document.myform2.elements.length; xx++)
{
if (document.myform2.elements[xx].type == 'checkbox' | document.myform2.elements[xx].type == 'radio')
{
document.myform2.elements[xx].checked = false;
}
}
}
// End --> </script> </HEAD> <!-- STEP TWO: Insert the onLoad event handler into your BODY tag --> <BODY onLoad="InitForm();" onreset="InitForm();"> <!-- STEP THREE: Copy this code into the BODY of your HTML document --> <form method="POST" name="myform"> <font face=Arial size=2>
Steak $15.25
<input type="checkbox" name="Steak" value=15.25 onclick="this.form.total.value=CheckChoice(this);">
Chicken $12.39
<input type="checkbox" name="Chicken" value=12.39 onclick="this.form.total.value=CheckChoice(this);">
Sushi $18.75
<input type="checkbox" name="Sushi" value=18.75 onclick="this.form.total.value=CheckChoice(this);"> <br><br> <b>Prepare with this special sauce (extra charge -- only one selection allowed):</b> <br>
None, thanks
<input type="radio" name="Sauce" value=none price=0.00
onclick="this.form.total.value=CheckChoice(this);">
Duck Sauce $10.99
<input type="radio" name="Sauce" value=duck price=10.99
onclick="this.form.total.value=CheckChoice(this);">
Ginger Sauce $5.00
<input type="radio" name="Sauce" value=ginger price=5.00
onclick="this.form.total.value=CheckChoice(this);">
Hot Sauce $1.50
<input type="radio" name="Sauce" value=hot price=1.50
onclick="this.form.total.value=CheckChoice(this);"> <br><br><br> <input type="hidden" name="hiddentotal" value=0> <input type="hidden" name="hiddenpriorradio" value=0> <font size=+1>
Your total is: <input type="text" name="total" readonly onFocus="this.blur();"> </font> <br><br>
(Note: Total can not be changed by the visitor.)
</font> </form> <p><center> <font face="arial, helvetica" size"-2">Free JavaScripts provided<br>
by <a href="http://javascriptsource.com">The JavaScript Source</a></font> </center><p> <!-- Script Size: 5.24 KB -->