|
|
|
Table des matières
Facturation
sur la vente de certains items
Pour faciliter les explications, nous allons employer une convension. Le texte qui sera écrit en noir sera du code HTML, celui en vert sera du javascript et celui en rouge sera soit du javascript soit du HTML à changer en fonction de vos besoins.
Je vais procéder par étape lorsque je vais faire les changements. Ne vous surprenez pas si je réécris des portions de script. Vous remarquerez que les éléments à changer ne seront pas les mêmes (texte rouge).
<html>
<BODY BACKGROUND="">
<title> A vendre</title>
<center><h1>Ce
que vous désirez et dont vous n'avez jamais<BR>eu le courage de demander (JR)</h1></center><BR>
<form method="post" action="/cgi-bin/formmail.pl">
<input type=hidden name="recipient" value="[email protected]">
<input type=hidden name="subject" value="My
JavaScript Order!">
<input type=hidden name="sort" value="order:Customer Name,Address,City,State,Telephone,Fax,email,Item1,Amt1,Item2,Amt2,Item3,Amt3,Item4,Amt4,Item5,Amt5,Item6,Amt6,Shipping,Tax,SubTotal,Total,pay by credit card,CC,card no,expiremonth,expireyear,pay by check">
<HR>
<!--- Counter SSI code --- >
<CENTER><H2><B>Order No: <!--#exec cgi="/cgi-bin/counter.pl"
--></B></H2></CENTER><BR>
<Center><I>Bon
achat</I></CENTER>
<SCRIPT LANGUAGE="JavaScript">
<!--- hide from old browsers --- >
var SAmt1 = 0.00,SAmt2 = 0.00,SAmt3=
0.00,SAmt4 = 0.00,SAmt5 = 0.00,SAmt6= 0.00;
var STax = 0.00,SSubTotal = 0.00,STotal = 0.00;
var Item1 ="",Item2 = "",Item3 = "",Item4
="",Item5 = "",Item6 = "";
var SShipping = 0;
/*****************
** Add a decimal point to a number
*/
function AddDecimal(number) {
var withdecimal = "";
var num = "" + number;
if (num.length == 0) {
withdecimal += "0";
} else if (num.length == 1) {
withdecimal += "0.0" + num;
} else if (num.length == 2) {
withdecimal += "0." + num;
} else {
withdecimal += num.substring(0, num.length - 2);
withdecimal += "."
withdecimal += num.substring(num.length - 2, num.length);
}
return withdecimal;
}
function compute(form)
{
SAmt1 = Math.round(eval(form.Item1.value * 24997));
SAmt2 = Math.round(eval(form.Item2.value * 14997));
SAmt3 = Math.round(eval(form.Item3.value * 31997));
SAmt4 = Math.round(eval(form.Item4.value * 6497));
SAmt5 = Math.round(eval(form.Item5.value * 3497));
SAmt6 = Math.round(eval(form.Item6.value * 11497));
SShipping = 795;
SShipping = Math.round(SShipping);
SSubTotal =(SAmt1 + SAmt2 + SAmt3 + SAmt4 + SAmt5 + SAmt6 + SShipping);
STax = Math.round((SAmt1 + SAmt2 + SAmt3 + SAmt4 + SAmt5 + SAmt6)*.27);
STotal =SSubTotal + STax;
form.Amt1.value = AddDecimal(SAmt1);
form.Amt2.value = AddDecimal(SAmt2);
form.Amt3.value = AddDecimal(SAmt3);
form.Amt4.value = AddDecimal(SAmt4);
form.Amt5.value = AddDecimal(SAmt5);
form.Amt6.value = AddDecimal(SAmt6);
form.Shipping.value = AddDecimal(SShipping);
form.SubTotal.value = AddDecimal(SSubTotal);
form.Tax.value = AddDecimal(STax);
form.Total.value = AddDecimal(STotal);
}
function ClearForm(form)
{form.Item1.value = "";
form.Item2.value = "";
form.Item3.value = "";
form.Item4.value = "";
form.Item5.value = "";
form.Item6.value = "";
SShipping = 0;
form.Shipping.value = 0;
SSubTotal = 0;
form.SubTotal.value = 0;
STax = 0;
form.Tax.value = 0;
SAmt1 = 0;
form.Amt1.value = 0;
SAmt2 = 0;
form.Amt2.value = 0;
SAmt3 = 0;
form.Amt3.value = 0;
SAmt4 = 0;
form.Amt4.value = 0;
SAmt5 = 0;
form.Amt5.value = 0;
SAmt6 = 0;
form.Amt6.value = 0;
SShipping = 0;
form.Shipping.value = 0
SSubTotal = 0;
form.SubTotal.value = 0;
STotal = 0;
form.Total.value = 0;
}
Ce qui est en vert
consiste essentiellement à illustrer le langague de programmation
JavaScript. Ce que vous venez de voir sont les définitions
des fonctions qui seront utilisées tout au long du codage.
Ce qui est aussi important est le JavaScript illustré
par le rouge. Il s'agit des prix pour chacun des items de la
facture. Cependant, vous ne devez pas mettre de point ni de virgule
pour séparer les dollars des sous.
<!-- done hiding from old
browsers -->
</SCRIPT>
</HEAD>
<BODY TEXT="##4C0000" BGCOLOR="#FFFFFF"
LINK="#990033" VLINK="#336633" ALINK="#0000FF">
<P>
<FORM>
<CENTER>
<TABLE BORDER=2 CELLSPACING=2 CELLPADDING=2 >
<TR>
<TD COLSPAN=5 BGCOLOR="#4C0000"><BR><CENTER>
<FONT COLOR="#FFFFFF"><FONT SIZE=+3>Des biens sur<BR> JEREMY
ROENICK</FONT></FONT></CENTER></TD></TR>
<TR><TD COLSPAN=5 BGCOLOR="#FFFFFF"><CENTER><B>Entrer la quantité désirée..Appuyez
sur "Donnez-moi un bon prix""</B></CENTER></TD></TR>
<TR>
<TD COLSPAN=5 BGCOLOR="#4C0000"><FONT COLOR="#FFFFFF">
</FONT></TD>
</TR>
<TR>
<TD><CENTER><B><I>Item</I></B>
</CENTER></TD>
<TD><CENTER> <B><I>Qty</I></B>
</CENTER></TD>
<TD><CENTER><B><I>Prix</I></B>
</CENTER></TD>
<TD></TD>
<TD><CENTER><B><I>Sous total</I></B>
</CENTER></TD>
</TR>
<TR>
<TD><CENTER><B>Chandails JR</CENTER></B></TD>
<TD><CENTER><INPUT
TYPE="text" NAME="Item1" SIZE=4 ></CENTER></TD>
<TD><CENTER><B>$249.97</B></CENTER></TD>
<TD></TD>
<TD ALIGN CENTER><CENTER><B>$</B><INPUT TYPE="text" NAME="Amt1" SIZE=6 ></CENTER></TD>
</TR>
<TR>
<TD><CENTER><B>Gants JR</CENTER></B></TD>
<TD><CENTER><INPUT
TYPE="text" NAME="Item2" SIZE=4 ></CENTER></TD>
<TD><CENTER><B>$149.97</B></CENTER></TD>
<TD></TD>
<TD ALIGN CENTER><CENTER><B>$</B><INPUT TYPE="text" NAME="Amt2" SIZE=6 ></CENTER></TD>
</TR>
<TR>
<TD><CENTER><B>Patins JR</CENTER></B></TD>
<TD><CENTER><INPUT
TYPE="text" NAME="Item3" SIZE=4 ></CENTER></TD>
<TD><CENTER><B>$319.97</B></CENTER></TD>
<TD></TD>
<TD ALIGN CENTER><CENTER><B>$</B><INPUT TYPE="text" NAME="Amt3" SIZE=6 ></CENTER></TD>
</TR>
<TR>
<TD><CENTER><B>Casques JR</CENTER></B></TD>
<TD><CENTER><INPUT
TYPE="text" NAME="Item4" SIZE=4 ></CENTER></TD>
<TD><CENTER><B>$64.97</B></CENTER></TD>
<TD></TD>
<TD ALIGN CENTER><CENTER><B>$</B><INPUT TYPE="text" NAME="Amt4" SIZE=6 ></CENTER></TD>
</TR>
<TR>
<TD><CENTER><B>Bas JR</CENTER></B></TD>
<TD><CENTER><INPUT
TYPE="text" NAME="Item5" SIZE=4 ></CENTER></TD>
<TD><CENTER><B>$34.97</B></CENTER></TD>
<TD></TD>
<TD ALIGN CENTER><CENTER><B>$</B><INPUT TYPE="text" NAME="Amt5" SIZE=6 ></CENTER></TD>
</TR>
<TR>
<TD><CENTER><B>Culottes JR</CENTER></B></TD>
<TD><CENTER><INPUT
TYPE="text" NAME="Item6" SIZE=4 ></CENTER></TD>
<TD><CENTER><B>$114.97</B></CENTER></TD>
<TD></TD>
<TD ALIGN CENTER><CENTER><B>$</B><INPUT TYPE="text" NAME="Amt6" SIZE=6 ></CENTER></TD>
</TR>
<TR>
<TD COLSPAN=2><CENTER><I>Frais de port et d'expédition: </I></CENTER></TD>
<TD><CENTER><B>$7.95</B></CENTER></TD>
<TD></TD>
<TD>
<B><CENTER>$</B><INPUT TYPE="text" NAME="Shipping" SIZE=6 ></CENTER></TD>
</TR>
<TR>
<TD COLSPAN=3><CENTER><INPUT TYPE="button" VALUE="Donnez-moi un bon prix" ONCLICK="compute(this.form)"> <INPUT TYPE="button" VALUE="Effacer" ONCLICK="ClearForm(this.form)"></CENTER></TD>
<TD ALIGN=CENTER><B>Total:</B></TD>
<TD><CENTER><B>$</B><INPUT TYPE="text" NAME="SubTotal" SIZE=6></CENTER></TD>
</TR>
<TR>
<TD COLSPAN=4>
<CENTER>Ce montant
inclus tous les frais.
</TD>
<TD ALIGN=CENTER>
<B>CA TOTAL:</B></TD>
</TR>
<TR>
<TD COLSPAN=2>
<CENTER>Taxe sur
JR 27% </CENTER></TD>
<TD ALIGN=CENTER><B>CA Tax:</B></TD><TD><B>$</B><INPUT TYPE="text" NAME="Tax" SIZE=5></TD>
<TD><CENTER><B>$</B><INPUT TYPE="text" NAME="Total" SIZE=7</CENTER></TD>
</TR>
</TABLE></CENTER>
<HR>
</form>
</body>
</html>
Ce qui est en rouge dans le texte ci-haut sont toutes les informations concernant le contenu de la facture. Pour ce qui est du vert, il s'agit du JavaScript qui est appelé.