Making a Shopping Cart page

Firstly, I have typed pieces of code between"<% " at the top and " %> " in a page called "shopCart.asp" before the start of -HTML- tags.

Define Constants

CONST CARTPID = 0
CONST CARTPNAME = 1
CONST CARTPPRICE = 2
CONST CARTPQUANTITY = 3

GET THE SHOPPING CART AND OR SET UP SESSION VARIABLE

IF NOT isArray( Session( "cart" ) ) THEN
DIM localCart( 4, 20 )
ELSE
localCart = Session( "cart" )
END IF

GET THE PRODUCT INFORMATION

productID = TRIM( Request( "pid" ) )
productName = TRIM( Request( "productName" ) )
productPrice = TRIM( Request( "productPrice" ) )

ADD ITEM TO SHOPPING CART

IF productID <> "" THEN
foundIT = FALSE
FOR i = 0 TO UBOUND( localCart )
IF localCart( CARTPID, i ) = productID THEN
localCart( CARTPQUANTITY, i ) = localCart( CARTPQUANTITY, i ) + 1
foundIT = TRUE
EXIT FOR
END IF
NEXT
IF NOT foundIT THEN
FOR i = 0 TO UBOUND( localCart, 2 )
IF localCart( CARTPID, i ) = "" THEN
localCart( CARTPID, i ) = productID
localCart( CARTPNAME, i ) = productName
localCart( CARTPPRICE, i ) = productPrice
localCart( CARTPQUANTITY, i ) = 1
EXIT FOR
END IF
NEXT
END IF
END IF

UPDATE THE QUANTITIES IN THE SHOPPING CART

IF Request( "updateQ" ) <> "" THEN
FOR i = 0 TO UBOUND( localCart, 2 )
newQ = TRIM( Request( "pq" & localCart( CARTPID, i ) ) )
IF newQ = "" or newQ = "0" THEN
localCart( CARTPID, i ) = ""
ELSE
IF isNumeric( newQ ) THEN
localCart( CARTPQUANTITY, i ) = newQ
END IF
END IF
NEXT
END IF

UPDATE SESSION VARIABLE WITH ARRAY

Session( "cart" ) = localCart

Secondly, I make a form that contains a simple table

Place the "Back to Shop" button in the left cell (image/backtoshop.gif) and link it to "product.asp".

Place the "Checkout" button in the centre cell (image/checkout.gif) and link it to "shopCart.asp".

Place a standard form "Submit" button in the right cell and label it "Update Cart"

Click on the "Update Cart" button to highlight it and then click on the "Quick Tag Editor" . Change <-input-> tag to read " <-input- type-=-image -src-="buttons/update.giff">

I click inside the form, just before the "Shopping Cart" text and insert a "Hidden Field".

Name the "Hidden Field" as "updateQ" and give it a value of "1".

Afterward, I click inside the right hand cell situated below the word "Quantity" and insert a "Text Field".

In the "Name" field (left on properties window beneath TextField), I type

pq<%=localCart(CARTPID, i )%>

In the "Char Width" field enter "4"

In the "Init Val" field enter

<%=localCart(CARTPQUANTITY,i )%>

Next step is to setup the form Action to shopCart.asp and the "Method" to "POST".

Now, I type some piece of code and put them in somewhere of the form.

I type

<%orderTotal = 0%>

in just after the opening tag.

I type the code below between the end "" of the first row and the beginning "" of the second row.

<% FOR i = 0 TO UBOUND( localCart, 2 ) IF localCart( CARTPID, i ) <> "" THEN
orderTotal = orderTotal + ( localCart( CARTPPRICE, i ) * localCart( CARTPQUANTITY, i ) )
%>

Next to get cart name for product name, I put

<%=Server.HTMLEncode( localCart( CARTPNAME, i ) )%>

into the tables second row , first cell.

In Design View, I can see the code that I just put in is under "Product Name"

Again, I put

<%=formatCurrency( localCart( CARTPPRICE, i ) )%>

into the tables second row , second cell.

So there should a ASP green sign uder "Price"

I put an end for a loop by

<% END IF NEXT %>

It was put between the end "" of the second row and the beginning "" of the third row.

a given code of Order Total

<%=formatCurrency( orderTotal )%>

was put into the third cell of the third row

so in the Design View of Dreamweaver, I see a ASP green sign on the left of "Order Total"

next step is to preview and test a function of shopping cart.

In "Quantity" text field, I replace number 3 instead of 1, then click on "Update To Cart"



However, There is error when I update a number of product quantity



So I post my question on ecommerce forum



Then get a solution



From a given hint from the forum, I fix my code in shopCart.asp



Then testing a fixed code o shopping cart function.

After selecting my favorite product, I come to the shopping cart with number 1 in quantity box. In the field of Unit Total Price and Total Order Price, I can see a price of 54.5 and 57.225 respectively.



After a click on button " Update Cart" , both fields of price are changed as well as a number of product quantity are updated.

My Website is actived on SEO engine

These are all website that I already submitted my website URL before, I can search my website now.

On Alexa Search engine



On Live Search search engine



On YAHOO



On Google



on London Stock Exchange



Moreover, I try my website ranking on Alexa and an analytic from Google.

Google Analytics



and Alexa ranking.



At the moment, there is no graph for my sites, I need to find a solution on how Google Analytic and Alexa pick up a number of visitors visiting my sites.

I post my question on different forum online to get solution.

Modify Product page and add product detail page

From original product page in my website, I extend it a bit more.

My plan is to make a page of product details. When customer view my product page, they can only see product ID, the name and the price, if they want to see more information or want to add the product to basket online, They can click on "more details" to go on.

On product page, I input "More Details" in the cell of table as below:



then, I highlight the text and switch to Server Behavior panel of Dreamweaver. Next, I drop down a server behavior menu by clicking on a sign "+" and choose a function called "Go to Detail Page"



A pop up window appear as a picture shown below:



As the link shown as "More Details", the detailed product page is in process.
I create a new ASP page called "productDetail.asp" then upload to the hosting server. this page is to store what product a customer want to view more detail . After that, I browse and choose productDetails.asp.
If the connection is still available, the product ID will be put in a text field of "Pass URL parameter" by default, then Set Value of Recordset "the name of recordset that we created "
column is also automatically setup with product ID.
Finally, I tick URL Parameters of "Passing Existing Parameters"



My next step is to create a product detail page

at this stage, I replace a cell of "more details" with Description row

Following the tutorial from webthang , I create a form, that contains 3 hidden text fields and a submit button, is named "addForm" with action="shopCart.asp" and "POST" method.

I click on each hidden textfield and name them as pid, productName, productPrice respectively



Then clicking on the button in order to change its name to "Add to Cart"



In case, If I would like to add an image for the button, I can follow a method shown below:

On the bottom right of Dreamweaver, there is a Quick Tag Editor which can help me edit a code directly instead switching to Code View.





When it is done, I can see it like



However, it is looked badly so I make up my mind to use simple button.



Moreover, I need to do a binding technique which makes hidden textfield of "addForm" Form link to shopCart.asp

First of all, selecting a hidden textfield such as productID, then clicking on proID on Binding Panel , on a row of "Bind to", choose "input.value" then clicking on Bind button.

At final stage, I preview my work on the browser.



Unfortunately, there is a error for the form with hidden textfields. Following the hint of error message. I switch to Code View then pick up a root of error.



Finally, I post my question on forum online



then get the answer relevant to my considering queston:



Following the hint above, I fix recordset in the web page then get the working result.

Modify and add nevigation to the website

On the home page, I draw a new layer which is called "apDiv15", input a link to login page and another to register page.



then make a effect for navigations



finally, I test it on the firefox browser.





and on the Internet Explorer version 6.



then apply the coding of navigation changing to all other pages such as product, about us, contact, etc.



In the product page, I add more to make all navigation like First, Next, Previous and Last, each of them will be changed when user point at.









after clicking on user login, by default, it will pass all kinds of user to login page which is for customer login access. The user login from other pages is changed to admin login in the login page. By this method, all customers will straitly login to their member area page and admin already know which access is for them.



In contrary to login page, admin login page does not have the text " if you are not a member yet, please register". This is beacause, admin is an owner of the website, he must know his user name and password.


If I have free time in advance, I think I will develop more extra protection on admin page.
Basically, I can add a extra text like " forget password" which guides an admin to a page that asks the user to validate extra authetication. If the authentication is past, the user can modify their password on sencond page and possibily get it from the user email.

This will help the admin who may have a lot of websites to manage, easy to get back their password when they forget , or, to prevent hackers stealing data in a short period.

More practical and more advance for preventing hacking website, I think the structure of website coding is a part of important rules, more over, SQL statement is also considered as well-known as SQL Injection.