Академический Документы
Профессиональный Документы
Культура Документы
A Capstone Project
Presented to the Faculty of
Information Communication Technology
ACLC College of Taytay
Bogtong, Jerssy C.
Bueza, Melyzza Mae H.
Claveles, Mary Anne E.
Cotoniel, Sherinel Shayne T.
Galicia, Jericho Laurence
Marquita, Andy Jay C.
Narciso, Earl Jay Ivan D.
Partosa , Dian Rose A.
Ribaya, Joeviline P.
Vallejo, Cyrus P.
1|P a g e
March 2018
CHAPTER 1
Introduction
There are many easy ways to get what does a person need and want in
everyday of our lives. With just one click on our devices we can easily have these things
.There are many advantages of having online websites. It can help us get easier and
more valuable ways to make things better and easier. Even though there are
advantages of using product website, there are still disadvantages or problems when
people are using online product website. Product website helps the customer to buy the
wants and needs of things with just simple click on our device. Online shopping is can
be called as the products being bought by the customer using website. By delivering a
process of transporting goods from a source location to a predefined destination, a
person can easily have the things he bought online. A buyer can get it also by meeting
up to the person who’s selling it, but many people still prefer on a delivered because it’s
much safer. The researchers conduct this kind of research to know what is the
advantages that a buyer can get from a product website and also to know how did a
researcher has came up to make this website.
2|P a g e
Definition of Terms
Access – a way of getting near at, or to something or someone data.
Anticipate - to think of (something that will or might happen in the future.
Communication - the act of process of using words, sounds, signs or behavior
to express your ideas, thoughts, feelings etc. to someone else.
Conduct – the way that a person behaves in a particular place or situation.
Consume – to use (fuel, time, resources, etc.)
Consumer - a person who buys and services.
Data - facts or information used usually to calculate, analyze, or plan something.
Encode – to put (a message) into the form of a code so that it can kept secret.
Implemented – an object used to do work.
Individual - relating to, or existing as just one member or part of a larger group.
Interface - the place or area at which different things meet and communicate
with or affect each other.
Limitation -the act of controlling the size or extent of something. The act of
limiting something.
Manual – doing or involving hard physical work.
Online – connected to a computer, a computer network, or the internet.
Product – something that is made or growth to be sold or used.
Purchase – to buy (property, goods, etc.) to get (something) by paying money
for it.
Research - careful study that is done to find and report new knowledge about
something.
System – a group of related parts that move or work together.
Traditional – a way of thinking, behaving, or doing something that has been
3|P a g e
used by the people in a particular group, family, society, etc. for a long time.
Project Context
General Problem
The general problem of this study is the use of manual or traditional way of
selling of products.
Specific Problem
4|P a g e
Purpose and Description
To record and to encode information of the customers for viewing
purposes through online product selling. It aims to help the customer to lessen
their time and effort by going to the branches or by just doing the traditional way
of buying products which is tends in time consuming than web-based online
product selling. It also aims to help the cashier to lessen their work and time by
manual computing of the payment of the customers. And the purpose of the
system is to let the customers to view and buy the product online followed by
their information same as the owner to be able to input products and information.
General Objective
The general objective of this study is to propose and develop an Online
Product Selling System for Shopee Shopee.
Specific Objectives
1. To create a website that can transact with the customers online easier
and faster.
2. This website must be also accessible in terms of recording of products.
3. This is also to create a website wherein customers will able to see
images of the products and as well as its descriptions accordingly.
5|P a g e
Scope and Limitation
Scope
There are two (2) interfaces in our system, first, the customer interface. In
this section the customers can view and choose products online.
The second interface is the admin interface. The second interface in the admin
interface. In this section, the admin could view the records and information of the
customers and stores products and view the payment of every customers.
Limitation
The limitation of customer interface is just online viewing including the
information of the products and the customer can buy it only, it cannot view the
records of the customers and can’t access the whole system. The limitation of
the admin’s interface it can view the records of the customer, store products and
view the payments only and can’t access the whole system. The system cannot
view offline.
6|P a g e
Chapter 2
Link: http://adspark.ph/filipino-buying-habits-offline-vs-online/
Keywords: convenience, many payment options, product-centric websites
Synthesis
One of the reasons why Filipinos love to shop online is convenient, instead of
traveling to the stores, just by clicking on our devices and with an internet connection
the customers can purchased the items they want.
over the world is flourishing intensively despite of some concerns such as lack of trust in
E-commerce. However, the study held concerning the acceptance of E-commerce has
been inadequate. Therefore, the study aims to examine the factors that affect the
adoption of E-commerce in Manila. The outcome of the research will be beneficial to
the firms to concentrate on the determinants that will induce the acceptance of E-
commerce in Manila”.
Link:http://www.dlsu.edu.ph/conferences/dlsu_research_congress/2014/_pdf/proceedin
gs/EBM-II-014-FT.pdf
Synthesis
While the population increasing the number of users of internet gets wider also.
The e-commerce have a good timing for them to make it easier for their valued
customers. They used a web-based selling of products.
Link: http://atiftap.org/assets/e-journal/jgbv3n1/v3n1_12.pdf
Keywords: online buying behavior, web site characteristics, product characteristics,
suppliers‟ characteristics, experience in online buying
Synthesis
Innovation is the goal of this web-based system to overcome traditional way of
shopping.
Link:http://www.bworldonline.com/content.php?section=Opinion&title=legal-issues-in-
buying-and-selling-online&id=68395
Synthesis
You can do shopping even without going to the store physically by just a click of
a mouse and tap on a mobile screen.
Synthesis
This website where you can shop on is a website that can compete with different
stores for cheaper and easier.
2.2 Foreign
Author: AmitSaha(2014)
Link: http://www.iosrjournals.org/iosr-jbm/papers/AETM%2715_MBA/2/25-MBA-145.pdf
Synthesis
The studies aim to highlight the impact of the increasing trend of online shopping.
Link: https://www.lyfemarketing.com/wp-content/uploads/2015/05/Compressed-
PDF.pdf
Synthesis
Both study aim to provide new opportunities to the consumers to engage in social
interaction in the internet or do shopping online.
Synthesis
11|P a g e
Both studies used online processing of shopping, since it has grew role in
marketing. They let consumers do online feedback about the product they bought.
2.2.4 An empirical study of online shopping customer satisfaction in China: a
holistic perspective
The purpose of this study is to identify factors that may influence Chinese
customers' online shopping satisfaction, including those which are ignored by prior
studies, from the perspective of total online shopping experience. In this paper, the
authors propose a model of the satisfaction process in the e ‐commerce environment,
identifying key constructs proposed by prior studies and developing hypotheses about
which dimensions of online retailer constructs are significant predictors of online
shopper satisfaction. The authors test the hypotheses through multiple regression
analysis based on a survey of 1,001 online customers. The analysis suggests that eight
constructs – information quality, web site design, merchandise attributes, transaction
capability, security/privacy, payment, delivery, and customer service – are strongly
predictive of online shopping customer satisfaction, while the effect of response time is
not significant.
Synthesis
Both studies proposed a website wherein it able to satisfy online consumers by
it’s information quality, website design, and security service.
Link: http://uu.diva-portal.org/smash/get/diva2:704299/FULLTEXT01.pdf
13|P a g e
Chapter 3
Methodology
This chapter discusses the System Development Life Cycle, Requirement
Specification and the Conceptual Framework.
agile method anticipates change and allows for much more flexibility than traditional
methods. The process involves breaking down each project into prioritize requirements,
and delivering each individually within an iterative cycle.
3.1.1 Brainstorm. The researchers plan a strategic way for the benefits of online
product selling. First, we gather information and conducted an interview to seek
permission and we come up to the idea of changing the traditional way of buying
products and incline to the rapid innovation of our technology which is web-based
inquiring and viewing products. The following instruments were conducted by the
researchers.
3.1.5 Quality Assurance. In this phase, they maintained the system availability
and performance in executive the work for which it was designed is maintained. And
whenever the system encounter any problem we will do a researcher to fix it and also to
continue development of the system to cope up to the rapid change of technology.
3.2 Requirement Specification. After all the Researchers gathered all the
information needed in online product selling, we analyzed the system in developing the
model from existing system of the instruction. The researcher construct new idea in
developing new system based on the gathered data, problems that will find solution
buying and selling products manually they reviewed well all the necessary requirement
to meet the desired idea for the new system to be developed. The following
requirements specification were checked and presented to meet the project objectives.
3.3 Analysis. The topics are given a deeper explanation in this question and the
researchers will present the study.
3.3.2 Research Locale. This study was conducted in Shopee Shopee located in
Taytay, Rizal by the customers and owner as respondents.
3.4 Design. The purpose of the system design is to create a technical solution
that satisfies the functional requirements for the system of online product selling.
3.4.1 Customers. In customers part they can inquire their product through their
registered customer number/information on the system. They can inquire anytime they
want they just need to follow the customers manual in order to get their product.
Unregistered number can’t view the product even the wrong customer number will be
invalid to get the product in order to get the correct products of customers they just need
to type or input their customers’ number. These are times that even their customers’
number is registered and owner shy that they are already have product but as long they
17|P a g e
3.5 Development and Testing. During the test of the integration of the website,
the programmer with tested if the intended output meets and desired performance of the
online product encoding and inquiring system before it was implemented. Maintaining
the product is always a priority, when errors occurred such as debugging during the
implementation. It has an error handler to avoid termination of the system. Since the
product was online and the manager are about to encode the online registration by the
help of internet technology, the customer can inquire their online registration by visiting
the website.
18|P a g e
3.6 Architectural Diagram
Admin CUSTOMERS
Create, Edit, Save and Delete View and Choose Products
COMPUTER
Online
Customers Inquiry System
For
19|P a g e
In Figure 3.2, Architectural Diagram of the System shows that all of the
components contribute to each other. Admin is the one who manage the system
including all the information that will be input in the database. Information includes
customers’ order and personal information, and products that will be input to the online
store. Admin plays the role as the System Administrator is the only person that has an
authorization in managing the owner page. Admin can create, edit, save and delete
information in the system which is Online Product Selling System for Customers. The
customers are only able to view all the information uploaded or added by the admin
because customer page is for viewing and buying purposes. In buying online,
customers have to input their customer code or information to be able to view and buy
the products.
20|P a g e
FOLDER STRUCTURE
ROOT
21|P a g e
CONTENT STRUCTURE
HOME.aspx CONTACT.aspx
Order.aspx
ADMIN.aspx
22|P a g e
WIREFRAME
LOGO
IMAGE IMAGE
HOME.aspx
CONTACT
TM
NUMBER
SMART
NUMBER
TNT
NUMBER
TEXT
CONTACT.aspx
24|P a g e
IMAGE IMAGE IMAGE
APPLIANCES.aspc/GADGETS.aspx/FURNITURE.aspx/CLOTHES.aspx/SHOES.aspx/WATCH.aspx/BAGS.aspx/
CARS.aspx
FULL NAME TEXTBOX
AGE TEXTBOX
CONTACT TEXTBOX
ADDRESS TEXTBOX
EMAIL TEXTBOX
PRODUCT TEXTBOX
QUANTITY TEXTBOX
SUBMIT
Order.aspx
26|P a g e
GRAPHICAL USER INTERFACE(GUI)
HOME.aspx
27|P a g e
CONTACT.aspx
28|P a g e
APPLIANCES.aspx
29|P a g e
GADGETS.aspx
30|P a g e
FURNITURE.aspx
31|P a g e
CLOTHES.aspx
32|P a g e
SHOES.aspx
33|P a g e
WATCH.aspx
34|P a g e
BAGS.aspx
35|P a g e
CARS.aspx
36|P a g e
USERS MANUAL
HOME.aspx
1. HOME has shows all different product buttons and logo.
2. Click CONTACT US button to show an Email and Contact Number.
3. Click each buttons such as
APPLIANCES,GADGETS,FURNITURE,CLOTHES,SHOES,WATCH,CARS and BAGS to show
its details and specifications .
4. After you click any buttons inside this page, you may click Buy Now to go to register
and record your order.
5. After you click the “SUBMIT” button. Your order will be automatically record into
admin.
1 2
37|P a g e
3
38|P a g e
CONTACT.aspx
39|P a g e
(PRODUCT)
APPLIANCES.aspx/GADGET.aspx/WATCH.aspx/FURNITURE.aspx/BAGS.aspx/SH
OES.aspx/CLOTHES.aspx/CARS.aspx
40|P a g e
Order.aspx
5
41|P a g e
SOURCE CODE
ASP
HOME.aspx
<html>
<head>
<link rel="Stylesheet" href="productdesign.css" />
<title>HOME PRODUCT</title>
</head>
<body background="PICTURES/body1.jpg">
<form id="form1" runat="server" class="style9">
<center>
<header id="page_header>"
<nav>
<ul>
<li><a id="nav" href="#">HOME</a>
<a id="nav" href="#">ABOUT</a>
<a id="nav" href="#">MAPS</a>
<a id="nav" href="CONTACT.aspx">CONTACT US</a>
<a id="nav" href="#">THINGS TO DO</a>
</li>
</ul>
</nav>
</header>
</center>
</asp:Panel>
43|P a g e
</form>
</body>
</html>
CONTACT.aspx
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<link rel="Stylesheet" href="productdesign.css" />
<title></title>
</head>
<body background="PICTURES/contactbackgound.jpg">
<form id="form1" runat="server">
<div class="style4">
</div>
</center>
</body>
</html>
FURNITURE.aspx
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<link rel="Stylesheet" href="productdesign.css" />
</head>
<body>
<form id="form1" runat="server">
<div>
<p style="width: 943px; height: 227px">
<img class="style1" src="PICTURES/FURNITURE.jpg"><img class="style3"
src="PICTURES/sofa.jpg" /><img alt="myphone" class="style4"
src="PICTURES/cabinet.jpg" /></p>
</div>
<p class="style5">
<asp:Label ID="Label3" runat="server" Text="Product Details"></asp:Label>
: &n
bsp;  
; &n
bsp;  
; &n
bsp;
<asp:Label ID="Label4" runat="server" Text="Product Details"></asp:Label>
: &n
45|P a g e
bsp;  
; &n
bsp;  
;
<asp:Label ID="Label5" runat="server" Text="Product Details"></asp:Label>
: &n
bsp;
<br />
DIVIDER &
nbsp;
&n
bsp;  
; &n
bsp;
&n
bsp;
SOFA &nb
sp;
&n
bsp;  
; &n
bsp;
CABINET<br /> <br />
KEY
SPECIFICATION:  
; &n
bsp;  
; &n
bsp;
KEY
SPECIFICATION:  
; &n
bsp;  
;
KEY SPECIFICATION:<br />-Shelving
Units &nbs
p; &
nbsp; &nbs
p; &
46|P a g e
nbsp;
-
&n
bsp;  
; &n
bsp;  
;
-<br /> -Room
Divider &n
bsp;  
; &n
bsp;  
;
- &n
bsp;  
; &n
bsp;  
;
-<br /> -Black Shelving
Unit  
; &n
bsp;  
; &n
bsp;
- &n
bsp;  
; &n
bsp;  
;
-<br /> -
Bookcase
&n
bsp;  
; &n
bsp;  
;
- &n
47|P a g e
bsp;  
; &n
bsp;  
;
-<br />-Interlocking
Shelves &
nbsp; &nbs
p; &
nbsp; &nbs
p;
- &n
bsp;  
; &n
bsp;  
;
- <br />-Item Weight: 1
pounds &n
bsp;  
; &n
bsp;  
;
- &n
bsp;  
; &n
bsp;  
;
-<br />-Product Dimensions:31.5x11.8x67
inches &nb
sp;
<br />-Assembled Height:66.75 inches <br /> <br /></p>
PostBackUrl="~/order.aspx" />
</form>
</body background="~/PICTURES/body2.jpg">
</html>
APPLIANCES.aspx
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<link rel="Stylesheet" href="productdesign.css" />
</head>
<body>
<form id="form1" runat="server">
<div>
<p><img class="style1" src="PICTURES/refrigerator.jpg"><img class="style3"
src="PICTURES/TV.jpg" /><img alt="myphone" class="style4"
src="PICTURES/Washingtone.jpg" /></p>
</div>
<p class="style5">
<asp:Label ID="Label3" runat="server" Text="Product Details"></asp:Label>
: &n
bsp;  
; &n
bsp;  
; &n
bsp;
<asp:Label ID="Label4" runat="server" Text="Product Details"></asp:Label>
: &n
bsp;  
; &n
bsp;  
;
<asp:Label ID="Label5" runat="server" Text="Product Details"></asp:Label>
: &n
bsp;
<br />PANASONIC
49|P a g e
142  
;
&n
bsp;  
; &n
bsp;
LED
TV
&n
bsp;  
; &n
bsp;
WASHINGTONE<br /> <br />
KEY
SPECIFICATION:  
; &n
bsp;  
; &n
bsp;
KEY
SPECIFICATION:  
; &n
bsp;  
;
KEY SPECIFICATION:<br />-76L
Bottom &n
bsp;  
; &n
bsp;  
;
- Resolution:1366 x
768  
; &n
bsp;  
; &n
bsp;
-3D Sensor Control Wash<br /> -Capacity, Fresh Food
163  
; &n
bsp;  
50|P a g e
;
-Refresh rate:60
Hz
&n
bsp;  
; &n
bsp;
-2-way Circulation Pump<br /> -Automatic 2/
Defrost &n
bsp;  
; &n
bsp;  
;
-Clear motion
rate:200 &
nbsp; &nbs
p; &
nbsp; &nbs
p;
-Heat Recycle Drying<br /> - Defrost System
Semi &nbs
p; &
nbsp; &nbs
p; &
nbsp;
-Response
time:5ms &
nbsp; &nbs
p; &
nbsp; &nbs
p;
-Stainless Steel<br />-Capacity, Fresh Foof
163  
; &n
bsp;  
;
-Power consumption:
60
&n
bsp;  
; &n
51|P a g e
bsp;
-Auto Self Clean <br />-Refrigerator Light
LED &nbs
p; &
nbsp; &nbs
p;
-Connectivity:HDMI x
2 &
nbsp; &nbs
p; &
nbsp; &nbs
p;
-Flat Inner Wall Hose<br />-Capacity, Freezer
79
<br />-245/8.7 Total Storage <br /> <br /></p>
< asp:Button ID="Button1" runat="server">
Text="PHP 10,999.00 (Buy Now)"
<asp:Button ID="Button2" runat="server"
Text="PHP 15,999.00 (Buy Now)"
<asp:Button ID="Button3" runat="server"
Text="PHP 18,999.00 (Buy Now)"
PostBackUrl="~/order.aspx" />
</form>
</body background="~/PICTURES/body2.jpg">
</html>
GADGETS.aspx
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<link rel="Stylesheet" />
</head>
<body>
<form id="form1" runat="server">
<div>
: &n
bsp;  
; &n
bsp;  
; &n
bsp;
&n
bsp;
<asp:Label ID="Label4" runat="server" Text="Product Details"></asp:Label>
: &n
bsp;  
; &n
bsp;  
;
<asp:Label ID="Label5" runat="server" Text="Product Details"></asp:Label>
: &n
bsp;
<br />Lenovo Ta64 Essential 7- inch
8GB &nbs
p; &
nbsp; &nbs
p;
Hwuawei Honor T3 KOB- Quad-Core 8.0inch
HD
MyPhone RIO<br />Wi-Fi only (slate
black) &nb
sp;
&n
bsp;  
;
Wifi 2G+ 5MP+2MP Camera<br /><br />
KEY
SPECIFICATION:  
; &n
bsp;  
; &n
53|P a g e
bsp;  
;
KEY
SPECIFICATION:  
; &n
bsp;  
;
KEY SPECIFICATION:<br />-OS: Android
Naugat &n
bsp;  
; &n
bsp;  
;
- System: Android 7.0 (EMUJ
5.1), &nbs
p; &
nbsp;
-5ich display<br />-Platform: mediaTeck
64-
bit
&n
bsp;  
; &n
bsp;
Snapdragon 425 Quad Core
1.4cHz &n
bsp;  
;
-2gb RAM+16gb ROM<br />(Quad-Core: up to 1.3
GHz) &nbs
p; &
nbsp; &nbs
p;
-Memory: 2GB RAM
1GBROM
&n
bsp;  
;
-8MP FRONT+50MP REAR<br />-Memory: 1 GB of ROM
<br />-Screen: 7" JPS 1024 x 600, 5-point Multi touch <br />-
Camera:
54|P a g e
BAGS.aspx
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<link rel="Stylesheet" href="productdesign.css" />
</head>
<body>
<form id="form1" runat="server">
<div>
<p>
<img class="style1" src="PICTURES/HAWK.jpg"><img class="style3"
src="PICTURES/JANSPORT.jpg" /><img alt="myphone" class="style4"
src="PICTURES/NIKE.jpg" /></p>
</div>
<p class="style5">
<asp:Label ID="Label3" runat="server" Text="Product Details"></asp:Label>
: &n
bsp;  
; &n
bsp;  
; &n
55|P a g e
bsp;
<asp:Label ID="Label4" runat="server" Text="Product Details"></asp:Label>
: &n
bsp;  
; &n
bsp;  
;
<asp:Label ID="Label5" runat="server" Text="Product Details"></asp:Label>
: &n
bsp;
<br /> HAWK
BAG &nbs
p;
&n
bsp;  
; &n
bsp; JANSPORT
BAG &nbs
p; &
nbsp; &nbs
p; &
nbsp;
NIKE BAG<br /> <br />
KEY
SPECIFICATION:  
; &n
bsp;  
; &n
bsp;
KEY
SPECIFICATION:  
; &n
bsp;  
;
KEY SPECIFICATION:<br />-Shelving
Units &nbs
p; &
nbsp; &nbs
56|P a g e
p; &
nbsp;
-
&n
bsp;  
; &n
bsp;  
;
-<br /> -Room
Divider &n
bsp;  
; &n
bsp;  
;
- &n
bsp;  
; &n
bsp;  
;
-<br /> -Black Shelving
Unit  
; &n
bsp;  
; &n
bsp;
- &n
bsp;  
; &n
bsp;  
;
-<br /> -
Bookcase
&n
bsp;  
; &n
bsp;  
;
57|P a g e
- &n
bsp;  
; &n
bsp;  
;
-<br />-Interlocking
Shelves &
nbsp; &nbs
p; &
nbsp; &nbs
p;
- &n
bsp;  
; &n
bsp;  
;
- <br />-Item Weight: 1
pounds &n
bsp;  
; &n
bsp;  
;
- &n
bsp;  
; &n
bsp;  
;
-<br />-Product Dimensions:31.5x11.8x67
inches &nb
sp;
<br />-Assembled Height:66.75 inches <br /> <br /></p>
CLOTHES.aspx
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<link rel="Stylesheet" href="productdesign.css" />
</head>
<body>
<form id="form1" runat="server">
<div>
<p>
<img class="style1" src="PICTURES/VARSITY.jpg"><img class="style3"
src="PICTURES/SHIRT.jpg" /><img alt="myphone" class="style4"
src="PICTURES/COATJACK.jpg" /></p>
</div>
<p class="style5">
<asp:Label ID="Label3" runat="server" Text="Product Details"></asp:Label>
: &n
bsp;  
; &n
bsp;  
; &n
bsp;
<asp:Label ID="Label4" runat="server" Text="Product Details"></asp:Label>
: &n
bsp;  
; &n
bsp;  
;
<asp:Label ID="Label5" runat="server" Text="Product Details"></asp:Label>
: &n
bsp;
59|P a g e
bsp;  
;
- &n
bsp;  
; &n
bsp;  
;
-<br /> -Black Shelving
Unit  
; &n
bsp;  
; &n
bsp;
- &n
bsp;  
; &n
bsp;  
;
-<br /> -
Bookcase
&n
bsp;  
; &n
bsp;  
;
- &n
bsp;  
; &n
bsp;  
;
-<br />-Interlocking
Shelves &
nbsp; &nbs
p; &
nbsp; &nbs
p;
- &n
61|P a g e
bsp;  
; &n
bsp;  
;
- <br />-Item Weight: 1
pounds &n
bsp;  
; &n
bsp;  
;
- &n
bsp;  
; &n
bsp;  
;
-<br />-Product Dimensions:31.5x11.8x67
inches &nb
sp;
<br />-Assembled Height:66.75 inches <br /> <br /></p>
<asp:Button ID="Button1" runat="server"
Text="PHP 1,999.00 (Buy Now)"
PostBackUrl="~/order.aspx" />
<asp:Button ID="Button2" runat="server"
Text="PHP 5,999.00 (Buy Now)"
PostBackUrl="~/order.aspx" />
<asp:Button ID="Button3" runat="server"
Text="PHP 8,999.00 (Buy Now)"
PostBackUrl="~/order.aspx" />
</form>
</body background="~/PICTURES/body2.jpg">
</html>
CARS.aspx
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<link rel="Stylesheet" href="productdesign.css" />
</head>
<body>
<form id="form1" runat="server">
<div>
62|P a g e
<p>
<img class="style1" src="PICTURES/FERRARI.jpg"><img class="style3"
src="PICTURES/PROTON.jpg" /><img alt="myphone" class="style4"
src="PICTURES/MAZDA.jpg" /></p>
</div>
<p class="style5">
<asp:Label ID="Label3" runat="server" Text="Product Details"></asp:Label>
: &n
bsp;  
; &n
bsp;  
; &n
bsp;
<asp:Label ID="Label4" runat="server" Text="Product Details"></asp:Label>
: &n
bsp;  
; &n
bsp;  
;
<asp:Label ID="Label5" runat="server" Text="Product Details"></asp:Label>
: &n
bsp;
<br /> FERRARI
CAR &nbs
p;
&n
bsp;  
; &n
bsp; PROTON
CAR &nbs
p; &
nbsp; &nbs
p; &
nbsp;
MAZDA CAR<br /> <br />
KEY
63|P a g e
SPECIFICATION:  
; &n
bsp;  
; &n
bsp;
KEY
SPECIFICATION:  
; &n
bsp;  
;
KEY SPECIFICATION:<br />-Shelving
Units &nbs
p; &
nbsp; &nbs
p; &
nbsp;
-
&n
bsp;  
; &n
bsp;  
;
-<br /> -Room
Divider &n
bsp;  
; &n
bsp;  
;
- &n
bsp;  
; &n
bsp;  
;
-<br /> -Black Shelving
Unit  
; &n
bsp;  
; &n
64|P a g e
bsp;
- &n
bsp;  
; &n
bsp;  
;
-<br /> -
Bookcase
&n
bsp;  
; &n
bsp;  
;
- &n
bsp;  
; &n
bsp;  
;
-<br />-Interlocking
Shelves &
nbsp; &nbs
p; &
nbsp; &nbs
p;
- &n
bsp;  
; &n
bsp;  
;
- <br />-Item Weight: 1
pounds &n
bsp;  
; &n
bsp;  
;
- &n
bsp;  
65|P a g e
; &n
bsp;  
;
-<br />-Product Dimensions:31.5x11.8x67
inches &nb
sp;
<br />-Assembled Height:66.75 inches <br /> <br /></p>
<asp:Button ID="Button1" runat="server"
Text="PHP 12,999.00 (Buy Now)"
PostBackUrl="~/order.aspx" />
<asp:Button ID="Button2" runat="server"
Text="PHP 5,999.00 (Buy Now)"
PostBackUrl="~/order.aspx" />
<asp:Button ID="Button3" runat="server"
Text="PHP 999.00 (Buy Now)"
PostBackUrl="~/order.aspx" />
</form>
</body background="~/PICTURES/body2.jpg">
</html>
WATCH.aspx
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<link rel="Stylesheet" href="productdesign.css" />
</head>
<body>
<form id="form1" runat="server">
<div>
<p>
<img class="style1" src="PICTURES/GSHOCK.jpg"><img class="style3"
src="PICTURES/QUARTZ.jpg" /><img alt="myphone" class="style4"
src="PICTURES/BASTAULIT.jpeg" /></p>
</div>
<p class="style5">
<asp:Label ID="Label3" runat="server" Text="Product Details"></asp:Label>
: &n
bsp;  
; &n
66|P a g e
bsp;  
; &n
bsp;
<asp:Label ID="Label4" runat="server" Text="Product Details"></asp:Label>
: &n
bsp;  
; &n
bsp;  
;
<asp:Label ID="Label5" runat="server" Text="Product Details"></asp:Label>
: &n
bsp;
<br /> G-SHOCK
WATCH &
nbsp;
&n
bsp;  
; QUARTZ
WATCH &
nbsp; &nbs
p; &
nbsp;
CURREN WATCH<br /> <br />
KEY
SPECIFICATION:  
; &n
bsp;  
; &n
bsp;
KEY
SPECIFICATION:  
; &n
bsp;  
;
KEY SPECIFICATION:<br />-Shelving
Units &nbs
p; &
nbsp; &nbs
67|P a g e
p; &
nbsp;
-
&n
bsp;  
; &n
bsp;  
;
-<br /> -Room
Divider &n
bsp;  
; &n
bsp;  
;
- &n
bsp;  
; &n
bsp;  
;
-<br /> -Black Shelving
Unit  
; &n
bsp;  
; &n
bsp;
- &n
bsp;  
; &n
bsp;  
;
-<br /> -
Bookcase
&n
bsp;  
; &n
bsp;  
;
68|P a g e
- &n
bsp;  
; &n
bsp;  
;
-<br />-Interlocking
Shelves &
nbsp; &nbs
p; &
nbsp; &nbs
p;
- &n
bsp;  
; &n
bsp;  
;
- <br />-Item Weight: 1
pounds &n
bsp;  
; &n
bsp;  
;
- &n
bsp;  
; &n
bsp;  
;
-<br />-Product Dimensions:31.5x11.8x67
inches &nb
sp;
<br />-Assembled Height:66.75 inches <br /> <br /></p>
<asp:Button ID="Button1" runat="server"
Text="PHP 10,999.00 (Buy Now)"
<asp:Button ID="Button2" runat="server"
Text="PHP 15,999.00 (Buy Now)"
<asp:Button ID="Button3" runat="server"
Text="PHP 18,999.00 (Buy Now)"
</form>
69|P a g e
</body background="~/PICTURES/body2.jpg">
</html>
SHOES.aspx
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<link rel="Stylesheet" href="productdesign.css" />
</head>
<body>
<form id="form1" runat="server">
<div>
<p>
<img class="style1" src="PICTURES/shoes1.jpg"><img class="style3"
src="PICTURES/COW.jpg" /><img alt="myphone" class="style4"
src="PICTURES/HIGH.jpg" /></p>
<p class="style5">
<asp:Label ID="Label3" runat="server" Text="Product Details"></asp:Label>
: &n
bsp;  
; &n
bsp;  
; &n
bsp;
<asp:Label ID="Label4" runat="server" Text="Product Details"></asp:Label>
: &n
bsp;  
; &n
bsp;  
;
<asp:Label ID="Label5" runat="server" Text="Product Details"></asp:Label>
: &n
bsp;
<br
/>
ADIDAS &
nbsp;
70|P a g e
&n
bsp;  
; &n
bsp; COW
SHOE &nb
sp;
&n
bsp;  
;
HIGH-CUT SHOE<br /> <br />
KEY
SPECIFICATION:  
; &n
bsp;  
; &n
bsp;
KEY
SPECIFICATION:  
; &n
bsp;  
;
KEY SPECIFICATION:<br />-Shelving
Units &nbs
p; &
nbsp; &nbs
p; &
nbsp;
-
&n
bsp;  
; &n
bsp;  
;
-<br /> -Room
Divider &n
bsp;  
; &n
bsp;  
;
71|P a g e
- &n
bsp;  
; &n
bsp;  
;
-<br /> -Black Shelving
Unit  
; &n
bsp;  
; &n
bsp;
- &n
bsp;  
; &n
bsp;  
;
-<br /> -
Bookcase
&n
bsp;  
; &n
bsp;  
;
- &n
bsp;  
; &n
bsp;  
;
-<br />-Interlocking
Shelves &
nbsp; &nbs
p; &
nbsp; &nbs
p;
- &n
bsp;  
; &n
72|P a g e
bsp;  
;
- <br />-Item Weight: 1
pounds &n
bsp;  
; &n
bsp;  
;
- &n
bsp;  
; &n
bsp;  
;
-<br />-Product Dimensions:31.5x11.8x67
inches &nb
sp;
<br />-Assembled Height:66.75 inches <br /> <br /></p>
ORDER.aspx
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
73|P a g e
<UpdateParameters>
<asp:Parameter Name="Full_name" Type="String" />
<asp:Parameter Name="Age" Type="String" />
<asp:Parameter Name="Contact" Type="String" />
<asp:Parameter Name="Address" Type="String" />
<asp:Parameter Name="Email" Type="String" />
<asp:Parameter Name="Product" Type="String" />
<asp:Parameter Name="Quantity" Type="String" />
<asp:Parameter Name="original_ID" Type="Int32" />
<asp:Parameter Name="original_Full_name" Type="String" />
<asp:Parameter Name="original_Age" Type="String" />
<asp:Parameter Name="original_Contact" Type="String" />
<asp:Parameter Name="original_Address" Type="String" />
<asp:Parameter Name="original_Email" Type="String" />
<asp:Parameter Name="original_Product" Type="String" />
<asp:Parameter Name="original_Quantity" Type="String" />
</UpdateParameters>
</asp:SqlDataSource>
<asp:GridView ID="GridView1" runat="server" AllowPaging="True"
AllowSorting="True" AutoGenerateColumns="False" DataKeyNames="ID"
DataSourceID="SqlDataSource1">
<Columns>
<asp:CommandField ShowDeleteButton="True" ShowEditButton="True"
ShowSelectButton="True" />
<asp:BoundField DataField="ID" HeaderText="ID" InsertVisible="False"
ReadOnly="True" SortExpression="ID" />
<asp:BoundField DataField="Full_name" HeaderText="Full_name"
SortExpression="Full_name" />
<asp:BoundField DataField="Age" HeaderText="Age"
SortExpression="Age" />
<asp:BoundField DataField="Contact" HeaderText="Contact"
SortExpression="Contact" />
<asp:BoundField DataField="Address" HeaderText="Address"
SortExpression="Address" />
<asp:BoundField DataField="Email" HeaderText="Email"
SortExpression="Email" />
<asp:BoundField DataField="Product" HeaderText="Product"
SortExpression="Product" />
<asp:BoundField DataField="Quantity" HeaderText="Quantity"
SortExpression="Quantity" />
</Columns>
75|P a g e
</asp:GridView>
</div>
</form>
</body>
</html>
ADMIN.aspx
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
</head>
<asp:SqlDataSource ID="SqlDataSource1" runat="server"
ConflictDetection="CompareAllValues"
ConnectionString="<%$ ConnectionStrings:ConnectionStringORDER %>"
DeleteCommand="DELETE FROM [ORDERDATA] WHERE [ID] =
@original_ID AND [FULL_NAME] = @original_FULL_NAME AND [AGE] =
@original_AGE AND [CONTACT] = @original_CONTACT AND [ADDRESS] =
@original_ADDRESS AND [EMAIL] = @original_EMAIL AND [PRODUCT] =
@original_PRODUCT AND [QUANTITY] = @original_QUANTITY"
InsertCommand="INSERT INTO [ORDERDATA] ([FULL_NAME], [AGE],
[CONTACT], [ADDRESS], [EMAIL], [PRODUCT], [QUANTITY]) VALUES
(@FULL_NAME, @AGE, @CONTACT, @ADDRESS, @EMAIL, @PRODUCT,
@QUANTITY)"
OldValuesParameterFormatString="original_{0}"
SelectCommand="SELECT * FROM [ORDERDATA]"
UpdateCommand="UPDATE [ORDERDATA] SET [FULL_NAME] =
@FULL_NAME, [AGE] = @AGE, [CONTACT] = @CONTACT, [ADDRESS] =
@ADDRESS, [EMAIL] = @EMAIL, [PRODUCT] = @PRODUCT, [QUANTITY] =
@QUANTITY WHERE [ID] = @original_ID AND [FULL_NAME] =
@original_FULL_NAME AND [AGE] = @original_AGE AND [CONTACT] =
@original_CONTACT AND [ADDRESS] = @original_ADDRESS AND [EMAIL] =
@original_EMAIL AND [PRODUCT] = @original_PRODUCT AND [QUANTITY] =
@original_QUANTITY">
<DeleteParameters>
<asp:Parameter Name="original_ID" Type="Int32" />
<asp:Parameter Name="original_FULL_NAME" Type="String" />
<asp:Parameter Name="original_AGE" Type="String" />
<asp:Parameter Name="original_CONTACT" Type="String" />
<asp:Parameter Name="original_ADDRESS" Type="String" />
<asp:Parameter Name="original_EMAIL" Type="String" />
76|P a g e
background-color:Blue;
font-size:20px;
color:White;
font-family:Arial, Verdana, Sans-Serif;
width: 145px;
79|P a g e
}
#nav : hover
{
background-color:Aqua;
}
.container
{
background-color:;
height: 666px;
width: 950px;
margin-left: 18px;
margin-top: 11px;
font-family: Arial, Helvetica, sans-serif;
background-color: #00FFFF;
}
.container1
{
width: 945px;
height: 48px;
margin-left: 14px;
}
.style1
{
width: 699px;
height: 367px;
margin-left: 14px;
margin-top: 19px;
}
.style2
{
width: 360px;
height: 257px;
margin-left: 64px;
margin-top: 12px;
margin-right: 4px;
}
a .shopi:link,hover
{
text-decoration:none;
}
80|P a g e
.style3
{
width: 196px;
height: 58px;
margin-left: 321px;
}
.style4
{
width: 699px;
height: 367px;
margin-left: 113px;
margin-top: 19px;
}
.style5
{
margin-left: 23px;
}
.style6
{
margin-left: 40px;
}
.style7
{
margin-left: 26px;
}
.style8
{
width: 196px;
height: 58px;
margin-left: 380px;
}
.style9
{
height: 1047px;
}
.style10
{
margin-left: 26px;
margin-top: 28px;
81|P a g e
}
.style11
{
margin-left: 25px;
}
.style12
{
margin-left: 45px;
}
.style4
{
width: 488px;
height: 52px;
font-size: xx-large;
color: #0000FF;
margin-left: 224px;
}
.style5
{
height: 293px;
width: 758px;
margin-left: 76px;
}
.style6
{
height: 297px;
}
.style7
{
color: #FF0000;
font-size: xx-large;
}
.style8
{
font-size: xx-large;
}
.style9
{
color: #FF0000;
}
Body
82|P a g e
{
height: 357px;
}
.style1
{
height: 215px;
width: 259px;
}
.style3
{
height: 209px;
width: 298px;
margin-left: 49px;
margin-top: 0px;
}
.style4
{
width: 248px;
height: 205px;
margin-left: 44px;
}
.style5
{
width: 947px;
height: 229px;
margin-bottom: 3px;
width: 943px;
height: 227px;
}
Button1
{
BackColor:#FF6600;
ForeColor:White;
Height:34px;
}
Button2
{
BackColor:#FF6600;
ForeColor:White;
Height:34px;
margin-left: 139px;
83|P a g e
}
Button3
{
BackColor:#FF6600;
ForeColor:White;
Height:34px;
margin-left: 139px;
}
84|P a g e