|
The MusicMad Shopping Basket
(Part 1) cont'd
Page 9 of 22 - Chapter
14
We split
the basket cookie into an array with the ampersand delimiting each piece of
data. We know each item has 5 pieces of data associated with it so our loop
increments in steps of 5. The item price is delimited by a £
sign which we need to remove using JavaScript's replace
method. We also keep a running total of the cost of each row (item
cost * quantity) which we display at the bottom of the table.
As we
loop through the data for each item we add table cells displaying the item's ArtistName,
Title
and we add a hidden input box with the ItemId
which forms part of any form post action taken in updating quantities.
<TABLE BORDER=0>
<TR BGCOLOR="#9F9F9F">
<TH><FONT FACE="Comic Sans MS"
SIZE="2">Artist</FONT></TH>
<TH><FONT FACE="Comic Sans MS"
SIZE="2">Title</FONT></TH>
<TH><FONT FACE="Comic Sans MS"
SIZE="2">Qty</FONT></TH>
<TH><FONT FACE="Comic Sans MS"
SIZE="2">Price Each</FONT></TH>
<TH><FONT FACE="Comic Sans MS"
SIZE="2">Total Price</FONT></TH>
</TR>
<%
var sbasketItems = new
String(Request.Cookies("Basket"));
var lTotal = 0;
var lItemTotal = 0;
// Each item's data in form
// ItemId&Qty&ArtistName&Title&Price£
sbasketItems = sbasketItems.split("&");
// loop through each item in basket
for (var lcounter=0; lcounter<sbasketItems.length-1; _
lcounter=lcounter+5)
{
// the price delimited by a £ sign - need to
remove that
// using string.replace method
sbasketItems[lcounter+4] =
sbasketItems[lcounter+4].replace(/£/,"");
// calculate item total
lItemTotal = (sbasketItems[lcounter+1] *
sbasketItems[lcounter+4]);
// add item total to grand total to be
displayed as
// summary at end of table
lTotal = lItemTotal + lTotal;
%>
<TR>
<TD ALIGN="CENTER" WIDTH="150"
BGCOLOR="#EFEFEF">
<FONT FACE="Comic Sans MS"
SIZE="2">
<!-- ArtistName
-->
<%=sbasketItems[lcounter
+ 2]%>
</FONT>
</TD>
<TD ALIGN="CENTER" WIDTH="250"
BGCOLOR="#EFEFEF">
<FONT FACE="Comic Sans MS"
SIZE="2">
<!-- Title -->
<%=sbasketItems[lcounter
+ 3]%>
</FONT>
</TD>
<TD ALIGN="CENTER" WIDTH="75"
BGCOLOR="#EFEFEF">
<!-- ItemId in hidden INPUT
box-->
<INPUT NAME="txt<%=sbasketItems[lcounter]%>"
TYPE="hidden"
VALUE="<%=sbasketItems[lcounter]%>"> |
Next the bReadOnly
variable determining whether this basket summary is updateable comes in to play.
If the basket's item quantities can't be updated then the quantity is displayed
as plain text and a hidden input box is placed on the form and is used after a
form post action to determine item quantity.
If
this is to be an updateable summary then a visible text input box is put in a
cell and is given the same name as a hidden one would. This means any code using
the basket's form does not need to know if this was an updateable or otherwise
view of the basket.
<%
if (bReadOnly == true)
{
Response.Write('<FONT
FACE="Comic Sans MS" SIZE="2">' + _
sbasketItems[lcounter + 1] + '</FONT>');
%>
<!-- hidden Quantity INPUT box
-->
<INPUT NAME="txtQty<%=sbasketItems[lcounter]%>"
TYPE="hidden"
VALUE="<%=sbasketItems[lcounter + 1]%>"
SIZE="3">
<%
}
else
{
%>
<!-- visible Quantity INPUT box
-->
<INPUT NAME="txtQty<%=sbasketItems[lcounter]%>"
TYPE="text"
VALUE="<%=sbasketItems[lcounter + 1]%>"
SIZE="2"
MAXLENGTH="2">
<%
}
%>
</TD> |
|