Page 15 of 22 - Chapter 14
Validating the User's Details (cont'd)
If the current year is the same
as the year the user selected and the month is before the current month then
we know the card has expired and we inform the user.
// Checks card not expired already
function checkCardExpDate(cboExpMonth,cboExpYear)
{
var nowDate = new Date();
var nowYear = nowDate.getYear();
var nowMonth = nowDate.getMonth() + 1;
var expYear = cboExpYear.options[cboExpYear.selectedIndex].VALUE;
var expMonth = cboExpMonth.options[cboExpMonth.selectedIndex].VALUE;
// some browsers return only 99 for the year so we need
// to compensate for that
if (nowYear == 0)
{
nowYear = 2000;
}
if (nowYear < 1900)
{
nowYear = nowYear + 1900;
}
if (expYear <= nowYear)
{
if (expMonth < nowMonth)
{
alert("According to the date you have entered,
your credit card has expired")
cboExpMonth.focus();
return false;
}
}
}
</SCRIPT>
|
Save this file as checkout_validate.inc.
The End - A Final Summary of the Order Details
The final page, before the user commits to purchasing, is the
summary page. We have all the details we need to complete the order and we are
giving the customer one last chance to check the details before
sending their order.
The form
contains all the information the user has entered and will be passed in the
final form submit. The information obtained from the previous forms is placed
at the top of the page in hidden text boxes whose values we populate using server-side
JScript.
<!--#include file="ServerSideGlobalDef.inc"-->
<HTML>
<HEAD>
<TITLE>Confirm Details</TITLE>
</HEAD>
<BODY>
<FORM ACTION="ProcessOrder.asp" method="POST">
<!-- Name/Address Details -->
<INPUT TYPE="HIDDEN" NAME="txtTitle"
VALUE="<%=Request.Form("txtTitle")%>">
<INPUT TYPE="HIDDEN" NAME="txtFirstName"
VALUE="<%=Request.Form("txtFirstName")%>">
<INPUT TYPE="HIDDEN" NAME="txtLastName"
VALUE="<%=Request.Form("txtLastName")%>">
<INPUT TYPE="HIDDEN" NAME="txtEmail"
VALUE="<%=Request.Form("txtEmail")%>">
<INPUT TYPE="HIDDEN" NAME="txtStreet"
VALUE="<%=Request.Form("txtStreet")%>">
<INPUT TYPE="HIDDEN" NAME="txtCity"
VALUE="<%=Request.Form("txtCity")%>">
<INPUT TYPE="HIDDEN" NAME="txtLocality"
VALUE="<%=Request.Form("txtLocality")%>">
<INPUT TYPE="HIDDEN" NAME="txtPostCode"
VALUE="<%=Request.Form("txtPostCode")%>">
<INPUT TYPE="HIDDEN" NAME="txtCountry"
VALUE="<%=Request.Form("txtCountry")%>">
<!-- Credit Card Details -->
<INPUT TYPE="HIDDEN" NAME="txtCCHolderName"
VALUE="<%=Request.Form("txtCardHolderName")
%>">
<INPUT TYPE="HIDDEN" NAME="txtCCNo"
VALUE="<%=Request.Form("txtCardNo")
%>">
<INPUT TYPE="HIDDEN" NAME="txtCCType"
VALUE="<%=Request.Form("radCardType")
%>">
<INPUT TYPE="HIDDEN" NAME="txtCCExpire"
VALUE="<%=Request.Form("cboExpMonth")
+ "/" +
Request.Form("cboExpYear") %>">
|
Our next task is to display a summary of the information the user entered starting
with the actual items in the order. We use the Basket.inc file we created earlier (and used
for the shopping basket) to actually display the summary, this time we want
it to be read only so bReadOnly is set
to true. The Basket.inc
file has hidden input elements with the ItemId's
and quantities of the order and these will be sent when the form is submitted.
<!-- Summarize Order details -->
<FONT FACE="Comic Sans MS" SIZE="+1"
color="Navy">
<P>Your order details are listed below.</P>
<P>
Once you have confirmed the details click
<INPUT TYPE="Submit" NAME="cmdSubmit"
VALUE="Submit Order">
to send your order
</P>
</FONT>
<STRONG><FONT FACE="Comic Sans MS" SIZE="3"
color="#FF8040">
<br>The following items<br><br>
</FONT></STRONG>
<!-- Summary of items in order -->
<%
bReadOnly = true;
%>
<!--#include file="Basket.inc"-->
<STRONG><FONT FACE="Comic Sans MS" SIZE="3"
color="#FF8040">
Will be delivered to<br>
</FONT></STRONG>
|
The next summary we display is that of the customer's name and address details
which we format by placing inside a table. The values are populated by ASP script
which retrieves them from those posted in the form submit that brought us to
this page.
<!-- Summary of NAME and address for delivery
-->
<TABLE cellspacing="2" cellpadding="2"
border="0">
<TR>
<TD>
<STRONG><FONT FACE="Comic Sans MS"
SIZE="2">
<%=Request.Form("txtTitle")%>
<%=Request.Form("txtFirstName")%>
<%=Request.Form("txtLastName")%>
</FONT></STRONG>
</TD>
</TR>
<TR>
<TD>
<STRONG><FONT FACE="Comic Sans MS"
SIZE="2">
<%=Request.Form("txtStreet")%>
</FONT></STRONG>
</TD>
</TR>
<TR>
<TD>
<STRONG><FONT FACE="Comic Sans MS"
SIZE="2">
<%=Request.Form("txtCity")%>
</FONT></STRONG>
</TD>
</TR>
<TR>
<TD>
<STRONG><FONT FACE="Comic Sans MS"
SIZE="2">
<%=Request.Form("txtLocality")%>
</FONT></STRONG>
</TD>
</TR>
<TR>
<TD>
<STRONG><FONT FACE="Comic Sans MS"
SIZE="2">
<%=Request.Form("txtPostCode")%>
</FONT></STRONG>
</TD>
</TR>
<TR>
<TD>
<STRONG><FONT FACE="Comic Sans MS"
SIZE="2">
<%=Request.Form("txtCountry")%>
</FONT></STRONG>
</TD>
</TR>
</TABLE>
|
The summary is completed with a summary of the credit card details and a restating
of exactly how much will be debited from the card.
<!-- Summary of amount to be charged to
credit card -->
<br>
<STRONG><FONT FACE="Comic Sans MS" SIZE="3"
color="#FF8040">
A total of <FONT color="Black">£<%=lTotal
+ 2.5 %></FONT>
will be debited from your <%=Request.Form("radCardType")%>
card
(Card details below)
</FONT></STRONG>
<!-- Show summary of card details -->
<TABLE>
<TR>
<TD>
<STRONG><FONT FACE="Comic Sans MS"
SIZE="2">
Name of credit card holder :
</FONT></STRONG>
</TD>
<TD>
<STRONG><FONT FACE="Comic Sans MS"
SIZE="2">
<%=Request.Form("txtCardHolderName")%>
</FONT></STRONG>
</TD>
</TR>
<TR>
<TD>
<STRONG><FONT FACE="Comic Sans MS"
SIZE="2">
Card Number
</FONT></STRONG>
</TD>
<TD>
<STRONG><FONT FACE="Comic Sans MS"
SIZE="2">
<%= Request.Form("txtCardNo") %>
</FONT></STRONG>
</TD>
</TR>
<TR>
<TD>
<STRONG><FONT FACE="Comic Sans MS"
SIZE="2">
Expiry Date
</FONT></STRONG>
</TD>
<TD>
<STRONG><FONT FACE="Comic Sans MS"
SIZE="2">
<%=Request.Form("cboExpMonth")%>
/
<%=Request.Form("cboExpYear") %>
</FONT></STRONG>
</TD>
</TR>
</TABLE>
<STRONG><FONT FACE="Comic Sans MS" SIZE="2">
Click
<INPUT TYPE="Submit" NAME="cmdSubmitBottom"
VALUE="Purchase items">
to send your order
</FONT></STRONG>
</FORM>
</BODY>
</HTML>
|
Save the page as CheckoutConfirm.asp