project report on e commerce website

59
Synopsis Clothes Collection Submitt ed by- As a practical part in the subject Fundamental of E-commerce

Upload: karandeep-singh

Post on 21-Apr-2015

5.400 views

Category:

Documents


2 download

TRANSCRIPT

Page 1: Project Report on e commerce website

SynopsisClothes Collection

Submitted by-

As a practical part in the subject Fundamental of E-commerce

Clothes Collection

Page 2: Project Report on e commerce website

Team Members-

My Role -> 1.) Making sign up ang sign in form2.) Connectivity of database3.) Inserting flash objects4.) Designing Part

Aknowledgements

Page 3: Project Report on e commerce website

I would like to thank our teacher Mr. for his support and proper guidance in the subject Fundamental of E-commerce. I would like to thank Mrs. for her support in the subject Web Designing in the previous semester

INTRODUCTION

Page 4: Project Report on e commerce website

Clothes Collection Clothing is one of the leading companies in India manufacturing, retailing and exporting readymade garments. Established in 1999, the company is a trendsetter in designing and supplying garments at the most competitive prices. A young at heart company, Clothes Collection clothing is constantly innovating, keeping abreast of internationally in vogue trends and is in compliance with the worldwide standards.

Since our establishment, we have achieved outstanding sales and stable growth. Today our products are distributed to many countries across the globe. We owe our success to quality, timely delivery, price and satisfaction of the clients.

TECHNOLOGIES WE USED IN THE PROJECT

Page 5: Project Report on e commerce website

HTML

HTML is a language for describing web pages.

HTML stands for Hyper Text Markup Language HTML is not a programming language, it is a markup language A markup language is a set of markup tags HTML uses markup tags to describe web pages

HTML Tags

HTML markup tags are usually called HTML tags

HTML tags are keywords surrounded by angle brackets like <html> HTML tags normally come in pairs like <b> and </b> The first tag in a pair is the start tag, the second tag is the end tag Start and end tags are also called opening tags and closing tags

HTML Documents = Web Pages

HTML documents describe web pages HTML documents contain HTML tags and plain text HTML documents are also called web pages

The purpose of a web browser (like Internet Explorer or Firefox) is to read HTML documents and display them as web pages. The browser does not display the HTML tags, but uses the tags to interpret the content of the page:

<html><body>

<h1>My First Heading</h1>

<p>My first paragraph.</p>

</body></html>

HTML Headings

HTML headings are defined with the <h1> to <h6> tags.

Page 6: Project Report on e commerce website

Example

<h1>This is a heading</h1><h2>This is a heading</h2><h3>This is a heading</h3>

HTML Paragraphs

HTML paragraphs are defined with the <p> tag.

Example

<p>This is a paragraph.</p><p>This is another paragraph.</p>

HTML Links

HTML links are defined with the <a> tag.

Example

<a href="http://www.w3schools.com">This is a link</a>

Note: The link address is specified in the href attribute.

HTML Images

HTML images are defined with the <img> tag.

Example

<img src="w3schools.jpg" width="104" height="142" />

HTML Elements

An HTML element is everything from the start tag to the end tag:

Start tag * Element content End tag *

Page 7: Project Report on e commerce website

<p> This is a paragraph </p>

<a href="default.htm" > This is a link </a>

<br />

* The start tag is often called the opening tag. The end tag is often called the closing tag.

HTML Element Syntax

An HTML element starts with a start tag / opening tag An HTML element ends with an end tag / closing tag The element content is everything between the start and the end tag Some HTML elements have empty content Empty elements are closed in the start tag Most HTML elements can have attributes

Tip: You will learn about attributes in the next chapter of this tutorial.

HTML Document Example

<html>

<body><p>This is my first paragraph.</p></body>

</html>

The example above contains 3 HTML elements.

HTML Example Explained

The <p> element:

<p>This is my first paragraph.</p>

The <p> element defines a paragraph in the HTML document.The element has a start tag <p> and an end tag </p>.The element content is: This is my first paragraph.

The <body> element:

<body><p>This is my first paragraph.</p></body>

Page 8: Project Report on e commerce website

The <body> element defines the body of the HTML document.The element has a start tag <body> and an end tag </body>.The element content is another HTML element (a p element).

The <html> element:

<html>

<body><p>This is my first paragraph.</p></body>

</html>

The <html> element defines the whole HTML document.The element has a start tag <html> and an end tag </html>.The element content is another HTML element (the body element).

Empty HTML Elements

HTML elements with no content are called empty elements. Empty elements can be closed in the start tag.

<br> is an empty element without a closing tag (the <br> tag defines a line break).

In XHTML, XML, and future versions of HTML, all elements must be closed.

Adding a slash to the start tag, like <br />, is the proper way of closing empty elements, accepted by HTML, XHTML and XML.

Even if <br> works in all browsers, writing <br /> instead is more future proof.

HTML Text Formatting Tags

Tag Description

<b> Defines bold text

<big> Defines big text

<em> Defines emphasized text

<i> Defines italic text

<small> Defines small text

<strong> Defines strong text

<sub> Defines subscripted text

<sup> Defines superscripted text

<ins> Defines inserted text

<del> Defines deleted text

HTML Style Example - Background Color

The background-color property defines the background color for an element:

Page 9: Project Report on e commerce website

Example

<html>

<body style="background-color:yellow"><h2 style="background-color:red">This is a heading</h2><p style="background-color:green">This is a paragraph.</p></body>

</html>

HTML Style Example - Font, Color and Size

The font-family, color, and font-size properties defines the font, color, and size of the text in an element:

Example

<html>

<body><h1 style="font-family:verdana">A heading</h1><p style="font-family:arial;color:red;font-size:20px;">A paragraph.</p></body>

</html>

HTML Style Example - Text Alignment

The text-align property specifies the horizontal alignment of text in an element:

Example

<html>

<body><h1 style="text-align:center">This is a heading</h1><p>The heading above is aligned to the center of this page.</p></body>

</html>

HTML Hyperlinks (Links)

A hyperlink (or link) is a word, group of words, or image that you can click on to jump to a new document or a new section within the current document.

When you move the cursor over a link in a Web page, the arrow will turn into a little hand.

Links are specified in HTML using the <a> tag.

The <a> tag can be used in two ways:

1. To create a link to another document, by using the href attribute

Page 10: Project Report on e commerce website

2. To create a bookmark inside a document, by using the name attribute

HTML Link Syntax

The HTML code for a link is simple. It looks like this:

<a href="url">Link text</a>

The href attribute specifies the destination of a link.

Example

<a href="http://www.akcjobconsultancy.com/">Visit akc</a>

which will display like this: Visit akcjobconsultancy

Clicking on this hyperlink will send the user to akc job consultancy' homepage.

HTML Links - The target Attribute

The target attribute specifies where to open the linked document.

The example below will open the linked document in a new browser window:

Example

<a href="http://www.akcjobconsultancy.com/" target="_blank">Visit akc!</a>

HTML Links - The name Attribute

The name attribute specifies the name of an anchor.

The name attribute is used to create a bookmark inside an HTML document.

Bookmarks are not displayed in any special way. They are invisible to the reader.

Example

A named anchor inside an HTML document:

<a name="tips">Useful Tips Section</a>

Create a link to the "Useful Tips Section" inside the same document:

Page 11: Project Report on e commerce website

<a href="#tips">Visit the Useful Tips Section</a>

Or, create a link to the "Useful Tips Section" from another page:

<a href="http://www.akcjobconsultancy.com/html_links.htm#tips">Visit the Useful Tips Section</a>

HTML The <img> Tag and the Src Attribute

In HTML, images are defined with the <img> tag. 

The <img> tag is empty, which means that it contains attributes only, and has no closing tag.

To display an image on a page, you need to use the src attribute. Src stands for "source". The value of the src attribute is the URL of the image you want to display.

Syntax for defining an image:

<img src="url" alt="some_text"/>

The URL points to the location where the image is stored. An image named "boat.gif", located in the "images" directory on "www.akcjobconsulatancy.com" has the URL: www.akcjobconsultancy.com/images/boat.gif.

The browser displays the image where the <img> tag occurs in the document. If you put an image tag between two paragraphs, the browser shows the first paragraph, then the image, and then the second paragraph.

HTML Forms

HTML forms are used to pass data to a server.

A form can contain input elements like text fields, checkboxes, radio-buttons, submit buttons and more. A form can also contain select lists, textarea, fieldset, legend, and label elements.

The <form> tag is used to create an HTML form:

<form>.input elements.</form>

HTML Forms - The Input Element

The most important form element is the input element.

The input element is used to select user information.

Page 12: Project Report on e commerce website

An input element can vary in many ways, depending on the type attribute. An input element can be of type text field, checkbox, password, radio button, submit button, and more.

The most used input types are described below.

Text Fields

<input type="text" /> defines a one-line input field that a user can enter text into:

<form>First name: <input type="text" name="firstname" /><br />Last name: <input type="text" name="lastname" /></form>

How the HTML code above looks in a browser:

First name:   

Last name: 

Note: The form itself is not visible. Also note that the default width of a text field is 20 characters. 

Password Field

<input type="password" /> defines a password field:

<form>Password: <input type="password" name="pwd" /></form>

How the HTML code above looks in a browser:

Password: 

Note: The characters in a password field are masked (shown as asterisks or circles). 

Radio Buttons

<input type="radio" /> defines a radio button. Radio buttons let a user select ONLY ONE one of a limited number of choices:

<form><input type="radio" name="sex" value="male" /> Male<br /><input type="radio" name="sex" value="female" /> Female</form>

How the HTML code above looks in a browser:

Page 13: Project Report on e commerce website

 Male

 Female

Checkboxes

<input type="checkbox" /> defines a checkbox. Checkboxes let a user select ONE or MORE options of a limited number of choices.

<form><input type="checkbox" name="vehicle" value="Bike" /> I have a bike<br /><input type="checkbox" name="vehicle" value="Car" /> I have a car </form>

How the HTML code above looks in a browser:

 I have a bike

 I have a car

Submit Button

<input type="submit" /> defines a submit button.

A submit button is used to send form data to a server. The data is sent to the page specified in the form's action attribute. The file defined in the action attribute usually does something with the received input:

<form name="input" action="html_form_action.asp" method="get">Username: <input type="text" name="user" /><input type="submit" value="Submit" /></form>

How the HTML code above looks in a browser:

Username:   Submit

If you type some characters in the text field above, and click the "Submit" button, the browser will send your input to a page called "html_form_action.asp". The page will show you the received input.

CSS

Style sheets are a very powerful tool for the Web site developer. They give you the chance to be completely consistent with the look and feel of your pages, while giving you much more control over the layout and design than straight HTML ever did.

Invented in 1997, Cascading Style Sheets are just now starting to be widely used among browsers and Web developers are learning to be more comfortable with them. Those of you who use HomeSite 4.0 know that they are eventually going to take the place of tags such as <FONT>, which have been deprecated in HTML 4.0.

There are three parts to CSS: the styles, their placement, and the fact that they can cascade.

Page 14: Project Report on e commerce website

How to Use Styles

When a browser reads a style sheet, it will format the document according to it.

There are three ways of inserting a style sheet:

External style sheet Internal style sheet Inline styles

External Style Sheet

An external style sheet is ideal when the style is applied to many pages. With an external style sheet, you can change the look of an entire Web site by changing one file. Each page must link to the style sheet using the <link> tag. The <link> tag goes inside the <head> section:

<head><link rel="stylesheet" type="text/css" href="mystyle.css" /></head>

Internal Style Sheet

An internal style sheet can be used if one single document has a unique style. Internal styles are defined in the <head> section of an HTML page, by using the <style> tag, like this:

<head><style type="text/css">body {background-color:yellow}p {color:blue}</style></head>

Inline Styles An inline style can be used if a unique style is to be applied to one single occurrence of an element.

To use inline styles, use the style attribute in the relevant tag. The style attribute can contain any CSS property. The example below shows how to change the text color and the left margin of a paragraph:

<p style="color:blue;margin-left:20px">This is a paragraph.</p>

MS-ACCESS

Ms Access is a database management tool that enables one to have good command of data collected. The

programme enables one to retrieve, sort, summarize and report results speedily and effectively. It can

Page 15: Project Report on e commerce website

combine data from various files through creating relationships, and can make data entry more efficient and

accurate. Microsoft Access (MS Access) enables one to manage all important information from a single

database file. Within the file, one can use:

• Tables to store your data.

• Queries to find and retrieve specific data of interest.

• Forms to view, add, and update data in tables.

• Reports to analyze or print data in a specific layout.

• Data access pages to view or update, the data.

In MS Access, data is stored once in one table, but can be viewed from multiple locations. When the data is

updated in a Table, Query or Form, it is automatically updated everywhere it appears Establishment of Ms

Access database All Ms Access databases files are saved with extension .mdb. A database should have a

separate table for every major subject, such as pedigree records, Production data or Treatment information.

Data should not be duplicated in multiple tables. Microsoft Access provides three methods to create a

database

„ Database Wizard (though easy, the wizard offers limited options to customize the database)

„ Using a template (This method works best if one can find and use a template that closely matches the

specific requirements)

„ Creating a database directly (This is the most flexible method, but it requires one to define each database

element separately). Create a new Access database After creating a new database, this should be saved by

the name which reflects the content of the database. Upon saving the database, the Ms Access database

window opens with the Tables tab-active (i.e in such a way that the next activity should be to create a table).

MS-Access Basic

Creating a table

Tables are the data storage facilities in Ms Access. Each table contains rows called records

Page 16: Project Report on e commerce website

and columns called fields. A record is a collection of facts about a particular animal or event. Each record in

a table should be unique. To distinguish one record from another, tables can contain a primary key field. A

field is a single kind of fact that may apply to each animal or event. For example, date of birth is a field in a

table on animal information. The fields in a database have settings that determine the

- type of data they can store,

- how the data is displayed,

- what can be done with the data.

For example, field settings can ensure that birth dates are entered with two numbers for the month, two

numbers for the day, four numbers for the year, and slashes in between:

01/04/2006.

One important setting for fields is the data type, which could be a number, text, currency, and date/time.

The data type limits and describes the kind of information in the field. The data type also determines the

actions one can perform on a field and how much memory the data will use. Fields also have properties that

control the details of information inside them, including a character length, a default value, and a validation

rule that makes sure the data meets certain criteria.

Tables may be created by either:

- Table wizard,

- Design view

- Entering data in a spreadsheet

JAVA SCRIPT

JavaScript

JavaScript was designed to add interactivity to HTML pages JavaScript is a scripting language A scripting language is a lightweight programming language JavaScript is usually embedded directly into HTML pages JavaScript is an interpreted language (means that scripts execute without preliminary

compilation)

Page 17: Project Report on e commerce website

Everyone can use JavaScript without purchasing a license

Are Java and JavaScript the same?NO!

Java and JavaScript are two completely different languages in both concept and design!

Java (developed by Sun Microsystems) is a powerful and much more complex programming language - in the same category as C and C++.

What can a JavaScript do?

JavaScript gives HTML designers a programming tool - HTML authors are normally not programmers, but JavaScript is a scripting language with a very simple syntax! Almost anyone can put small "snippets" of code into their HTML pages

JavaScript can put dynamic text into an HTML page - A JavaScript statement like this: document.write("<h1>" + name + "</h1>") can write a variable text into an HTML page

JavaScript can react to events - A JavaScript can be set to execute when something happens, like when a page has finished loading or when a user clicks on an HTML element

JavaScript can read and write HTML elements - A JavaScript can read and change the content of an HTML element

JavaScript can be used to validate data - A JavaScript can be used to validate form data before it is submitted to a server. This saves the server from extra processing

JavaScript can be used to detect the visitor's browser - A JavaScript can be used to detect the visitor's browser, and - depending on the browser - load another page specifically designed for that browser

JavaScript can be used to create cookies - A JavaScript can be used to store and retrieve information on the visitor's computer

Page 18: Project Report on e commerce website

SCREEN SHOTS & CODING

Page 19: Project Report on e commerce website

HOMEPAGE

Page 20: Project Report on e commerce website

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

<html>

Page 21: Project Report on e commerce website

<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<title>Clothes Fasion</title><link rel="stylesheet" href="style.css" type="text/css" charset="utf-8" />

</head>

<body>

<div id="wrapper">

<div id="header"><h1><a

href="index.html"><em>Clothes</em><strong>COLLECTION</strong></a></h1></div>

<div id="left-person"></div>

<div id="uppers">

<div id="nav-top"><ul>

<li><a href="sign in.html">Sign In</a> |</li><li><a href="sign _up.html">Sign Up</a> |</li><li><a href="contact_us.html">Contact us</a></li>

</ul></div>

</div>

<div id="nav"><div><ul>

<li><a href="index.html"></a> &nbsp;|&nbsp;</li>

<li><a href="acc.html"></a> &nbsp;|&nbsp;</li><li><a href="men.html">MEN COLLECTION</a> &nbsp;|

&nbsp;</li><li><a href="women.html">WOMEN COLLECTION</a>

&nbsp;|&nbsp;</li><li><a href="kids.html">KIDS COLLECTION</a></li>

</ul></div></div>

Page 22: Project Report on e commerce website

<div id="body">

<p>Clothes Collection Clothing is one of the leading companies in India manufacturing, retailing and exporting readymade garments.Established in 1999, the company is a trendsetter in designing and supplying garments at the most competitive prices. A young at heart company, Clothes Collection clothing is constantly innovating, keeping abreast of internationally in vogue trends and is in compliance with the worldwide standards. </p>

Since our establishment, we have achieved outstanding sales and stable growth. Today our products are distributed to many countries across the globe. We owe our success to quality, timely delivery, price and satisfaction of the clients.

</div>

<div id="black-tl"><div id="black-tr">

<div id="black-br"><div id="black-bl">

<div class="black-box"><h2>MEN</h2><p><a href="men.html"><img

src="images/pic_1.jpg" alt="Pic 1" width="120" height="105" border="0" /></a></p><p>Men's Wear has always been a forte

and strong hold of Clothes Collection Clothing. We have the best possible set up to design and produce any style in Men's Wear segment. Our range includes Formal wear, Club wear, Street wear and Denims. The fabrics used are normally cottons sourced from best of the mills in India.

<p class="more">&nbsp;</p></div>

<div class="black-box"><h2>WOMEN</h2><p><a href="women.html"><img

src="images/pic_2.jpg" alt="Pic 2" width="120" height="105" border="0" /></a></p><p>Our design team specialises in

designing the latest high fashion women's wear garments including Evening dresses, Tunics, Embroidered shirts, sequenced tops etc. The range is always designed keep in mind the season's latest international fashion trends. The fabrics used are Georgette, Crepe, Viscose, Poplins and Cambric.</a>.</p>

<p class="more">&nbsp;</p></div>

Page 23: Project Report on e commerce website

<div class="black-box"><h2>KIDS</h2><p><a href="kids.html"><img

src="images/pic_3.jpg" alt="Pic 3" width="120" height="105" border="0" /></a></p>

<p class="more">&nbsp;</p></div>

<div class="clear"></div></div>

</div></div>

</div>

<div id="footer"><div id="tips">

<h2><em>Fasion</em> tips</h2><p>For those of you who are fat or on the heavier side, you

don't desire to be tiring turtlenecks this wintry weather. Try to purchase sweaters or elongated covering tops with a V-neck. This obviously describes the eyes downhill producing the cause of a sleeker outline. It as well crafts you come out to enclose a longer neck instead of your small neck or dual chin.</p>

<p class="more"><a href="http://www.freewebsitetemplates.com"></a></p>

</div><div id="choose">

<h2><em> Choose</em> a designer</h2>

<p align="left">Choose a Designer</p><form action=" ">

<div align="left"> <select name="q"> <option value=" ">Designer</option> <option value="1">Manish Malhotra</option> <option value="2">Rohit Bal</option> <option value="3">Ritu kumar</option> <option value="4">Zara</option>

</select> <input type="image" name="submit"

src="images/btn_footer.gif" id="submit" />

Page 24: Project Report on e commerce website

</div></form>

</div></div>

<div class="clear"></div>

<div id="copyright"> <div align="center">Copyright information goes here. All rights reserved</div></div>

</div>

</body></html>

MEN CLOTHING

Page 25: Project Report on e commerce website

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

Page 26: Project Report on e commerce website

<html><head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<title>MEN COLLECTION</title><link rel="stylesheet" href="style.css" type="text/css" charset="utf-8" />

<script type="text/javascript" src="swfobject.js"></script><script type="text/javascript">

var flashvars = {};

flashvars.folderPath = "men/";var params = {};params.scale = "noscale";params.salign = "tl";params.wmode = "transparent";var attributes = {};swfobject.embedSWF("men/ImageScrollerFX.swf",

"ImageScrollerFXDiv", "575", "700", "9.0.8", true, flashvars, params, attributes);</script>

</head>

<body>

<div id="wrapper">

<div id="header"><h1><em><a href="index.html">Clothes</a></em><a

href="index.html"><strong>COLLECTION</strong></a></h1></div>

<div id="left-person"></div>

<div id="uppers">

<div id="nav-top"><ul>

<li><a href="sign in.html">Site in</a> |</li><li><a href="sign _up.html">Sign Up</a> |</li><li><a href="contact_us.html">Contact us</a></li>

</ul></div>

Page 27: Project Report on e commerce website

</div>

<div id="nav"><div><ul>

<li><a href="index.html">HOME</a> &nbsp;|&nbsp;</li>

<li><a href="acc.html">ACCESSORIES</a> &nbsp;|&nbsp;</li>

<li><a href="women.html">WOMEN COLLECTION</a> &nbsp;|&nbsp;</li>

<li><a href="kids.html">KIDS COLLECTION</a></li></ul><div id="ImageScrollerFXDiv">

</div></div><div id="copyright"> <div align="center">Copyright information goes here. All rights reserved</div></div>

</div>

</body></html>

WOMEN CLOTHING

Page 28: Project Report on e commerce website

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

<html><head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

Page 29: Project Report on e commerce website

<title>WOMEN COLLECTION</title><link rel="stylesheet" href="style.css" type="text/css" charset="utf-8" />

<script type="text/javascript" src="swfobject.js"></script><script type="text/javascript">

var flashvars = {};

flashvars.folderPath = "women/";var params = {};params.scale = "noscale";params.salign = "tl";params.wmode = "transparent";var attributes = {};swfobject.embedSWF("women/ImageScrollerFX.swf",

"ImageScrollerFXDiv", "575", "700", "9.0.8", true, flashvars, params, attributes);</script>

</head>

<body>

<div id="wrapper">

<div id="header"><h1><em>Clothes</em><strong>COLLECTION</strong></h1>

</div>

<div id="left-person"></div>

<div id="uppers">

<div id="nav-top"><ul>

<li><a href="sign in.html">Sign in</a> |</li><li><a href="sign _up.html">Sign Up</a> |</li><li><a href="contact_us.html">Contact us</a></li>

</ul></div>

</div>

<div id="nav"><div>

Page 30: Project Report on e commerce website

<ul><li><a href="index.html">HOME</a> &nbsp;|&nbsp;</li>

<li><a href="acc.html">ACCESSORIES</a> &nbsp;|&nbsp;</li>

<li><a href="men.html">MEN COLLECTION</a> &nbsp;|&nbsp;</li>

<li><a href="kids.html">KIDS COLLECTION</a></li></ul><div id="ImageScrollerFXDiv">

</div></div><div id="copyright">Copyright information goes here. All rights reserved</div>

</div>

</body></html>

KIDS CLOTHING

Page 31: Project Report on e commerce website

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"><html><head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<title>KIDS COLLECTION</title>

Page 32: Project Report on e commerce website

<link rel="stylesheet" href="style.css" type="text/css" charset="utf-8" /><script type="text/javascript" src="swfobject.js"></script>

<script type="text/javascript">var flashvars = {};

flashvars.folderPath = "kids/";var params = {};params.scale = "noscale";params.salign = "tl";params.wmode = "transparent";var attributes = {};swfobject.embedSWF("kids/ImageScrollerFX.swf",

"ImageScrollerFXDiv", "575", "700", "9.0.8", true, flashvars, params, attributes);</script>

</head>

<body>

<div id="wrapper">

<div id="header"><h1><em>Clothes</em><strong>COLLECTION</strong></h1>

</div>

<div id="left-person"></div>

<div id="uppers">

<div id="nav-top"><ul>

<li><a href="sign in.html">Sign in</a> |</li><li><a href="sign _up.html">Sign Up</a> |</li><li><a href="contact_us.html">Contact us</a></li>

</ul></div>

</div>

<div id="nav"><div><ul>

<li><a href="index.html">HOME</a> &nbsp;|&nbsp;</li>

<li><a href="acc.html">ACCESSORIES</a> &nbsp;|&nbsp;</li>

Page 33: Project Report on e commerce website

<li><a href="men.html">MEN COLLECTION</a> &nbsp;|&nbsp;</li>

<li><a href="women.html">WOMEN COLLECTION</a> &nbsp;|&nbsp;</li>

</ul><div id="ImageScrollerFXDiv">

</div></div>

SIGN UP

Page 34: Project Report on e commerce website

<html><head><title>Sign Up </title>

Page 35: Project Report on e commerce website

<link rel="stylesheet" href="style.css" type="text/css" charset="utf-8" />

<script language="JavaScript" >

function validate(form) { var day=document.getElementById("txtday"); var month=document.getElementById("txtmonth"); var year=document.getElementById("txtyear"); var gender=document.getElementById("txtgender"); var country=document.getElementById("country"); var firstname=document.getElementById("firstname").value; var lastname=document.getElementById("lastname"); var username=document.getElementById("username"); var pwd=document.getElementById("pwd"); var pwd2=document.getElementById("pwd2"); var email=document.getElementById("email"); var email2=document.getElementById("email2")

if(form.firstname.value =="") { alert("first name cannot be empty"); form.firstname.focus(); return false; }

if(form.lastname.value =="") { alert("last name cannot be empty"); form.lastname.focus(); return false; }

re = /^\w+$/; if(!re.test(form.username.value)) { alert("Error: Username must contain only letters, numbers and underscores!"); form.username.focus(); return false; }

Page 36: Project Report on e commerce website

if(form.pwd.value == form.firstname.value) { alert("Error: Password must be different from Username!"); form.pwd.focus(); return false; }

if (form.pwd.value != form.pwd2.value) { alert('both password dont match!'); form.pwd.focus(); return false; }

if(form.pwd.value.length <6) { alert("Error: Password must contain at least six characters!"); form.pwd.focus(); return false; } if (form.email.value != form.email2.value) { alert('both email address dont match!'); form.email.focus(); return false; }

var adoConn = new ActiveXObject("ADODB.Connection"); var adoRS = new ActiveXObject("ADODB.Recordset"); var day=document.getElementById("txtday"); var month=document.getElementById("txtmonth"); var year=document.getElementById("txtyear"); var gender=document.getElementById("txtgender"); var country=document.getElementById("country"); var firstname=document.getElementById("firstname"); var lastname=document.getElementById("lastname"); var username=document.getElementById("username"); var pwd=document.getElementById("pwd");

Page 37: Project Report on e commerce website

var pwd2=document.getElementById("pwd2"); var email=document.getElementById("email"); var email2=document.getElementById("email2")

adoConn.Open("Provider=Microsoft.Jet.OLEDB.4.0;Data Source=C:/customer2.mdb"); adoRS.Open("Select * From cust", adoConn, 1, 3); adoRS.AddNew;

adoRS.Fields("firstname").value =firstname.value;

adoRS.Fields("lastname").value = lastname.value;

adoRS.Fields("username").value = username.value;

adoRS.Fields("password").value = pwd.value;

adoRS.Fields("email").value = email.value;

for (i=0; i<document.kandy.sex.length; i++) { if (document.kandy.sex[i].checked==true) { adoRS.Fields("gender").value=document.kandy.sex[i].value } } var abc=day.options[day.selectedIndex].value + "/" + month.options[month.selectedIndex].value + "/" + year.options[year.selectedIndex].value;

adoRS.Fields("dob").value=abc; adoRS.Fields("country").value= country.value;

alert("THANK YOU!! for Registering");

adoRS.Update; adoRS.Close(); adoConn.Close();

}

Page 38: Project Report on e commerce website

</script></head>

<body>

<div id="wrapper">

<div id="header"><h1><a

href="index.html"><em>Clothes</em><strong>COLLECTION</strong></a></h1></div>

<div id="left-person"></div>

<div id="uppers">

<div id="nav-top"><ul>

<li><a href="site.html">Site map</a> |</li><li><a href="sign.html">Sign Up</a> |</li><li><a href="contact.html">Contact us</a></li>

</ul></div>

</div>

<div id="nav"><div><ul>

<li><a href="index.html"></a> &nbsp;|&nbsp;</li>

<li><a href="acc.html">ACCESSORIES</a> &nbsp;|&nbsp;</li>

<li><a href="men.html">MEN COLLECTION</a> &nbsp;|&nbsp;</li>

<li><a href="women.html">WOMEN COLLECTION</a> &nbsp;|&nbsp;</li>

<li><a href="kids.html">KIDS COLLECTION</a></li></ul>

</div></div>

<div id="body"> </div>

<div id="black-tl"><div id="black-tr">

Page 39: Project Report on e commerce website

<div id="black-br"><div id="black-bl">

<P><font color=white><H1>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Sign Up Form</H1><br><br><form name="kandy" method="POST" ><table><td valign="middle">First Name:</th>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="text" name="firstname" /></td></table><BR>

<table><td valign="center">Last Name:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<INPUT TYPE="TEXT" name="lastname" ></td></table><BR>

<table><td valign="center">User Id :&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<INPUT TYPE="TEXT" NAME="username" ></td></table><BR>

<table><td valign="center">Password :&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<INPUT TYPE="PASSWORD" NAME="pwd" /></td></table><BR>

Page 40: Project Report on e commerce website

<table><td valign="center">Confirm Password &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<INPUT TYPE="password" NAME="pwd2" ></td></table><BR>

<table><td valign="center">Email:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<INPUT TYPE="text" NAME="email" ></td></table><BR>

<table><td valign="center">Confirm Email :&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<INPUT TYPE="text" NAME="email2" ></td></table><BR>

<table><td valign="center">Gender:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" name="sex" value="male"> Male<input type="radio" name="sex" value="female"> Female<BR></td></table><br>

<table><td valign="center">Date of Birth:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<SELECT NAME="txtday" VALUE="[SELECTDATE]">

<OPTION>SELECT DATE</OPTION><OPTION value="1">1</OPTION><OPTION value="2">2</OPTION><OPTION value="3">3</OPTION><OPTION value="4">4</OPTION><OPTION value="5">5</OPTION>

Page 41: Project Report on e commerce website

<OPTION value="6">6</OPTION><OPTION value="7">7</OPTION><OPTION value="8">8</OPTION><OPTION value="9">9</OPTION><OPTION value="10">10</OPTION><OPTION value="11">11</OPTION><OPTION value="12">12</OPTION><OPTION value="13">13</OPTION><OPTION value="14">14</OPTION><OPTION value="15">15</OPTION><OPTION value="16">16</OPTION><OPTION value="17">17</OPTION><OPTION value="18">18</OPTION><OPTION value="19">19</OPTION><OPTION value="20">20</OPTION><OPTION value="21">21</OPTION><OPTION value="22">22</OPTION><OPTION value="23">23</OPTION><OPTION value="24">24</OPTION><OPTION value="25">25</OPTION><OPTION value="26">26</OPTION><OPTION value="27">27</OPTION><OPTION value="28">28</OPTION><OPTION value="29">29</OPTION><OPTION value="30">30</OPTION><OPTION value="31">31</OPTION></SELECT>

<SELECT NAME="txtmonth" VALUE="[SELECT VALUE]"><OPTION >SELECT MONTH</OPTION><OPTION value="01">JANUARY</OPTION<OPTION value="02">FEBUARY</OPTION><OPTION value="03">MARCH</OPTION><OPTION value="04">APRIL</OPTION><OPTION value="05">MAY</OPTION><OPTION value="06">JUNE</OPTION><OPTION value="07">JULY</OPTION><OPTION value="08">AUGUST</OPTION><OPTION value="09">SEPTEMBER</OPTION><OPTION value="10">OCTOBER</OPTION><OPTION value="11">NOVEMBER</OPTION><OPTION value="12">DECEMBER</OPTION></SELECT>

Page 42: Project Report on e commerce website

<SELECT NAME="txtyear" VALUE="YEAR"><OPTION>SELECT YEAR</OPTION><OPTION value="1980">1980</OPTION><OPTION value="1981">1981</OPTION><OPTION value="1982">1982</OPTION><OPTION value="1983">1983</OPTION><OPTION value="1984">1984</OPTION><OPTION value="1985">1985</OPTION><OPTION value="1986">1986</OPTION><OPTION value="1987">1987</OPTION><OPTION value="1988">1988</OPTION><OPTION value="1989">1989</OPTION><OPTION value="1990">1990</OPTION><OPTION value="1991">1991</OPTION><OPTION value="1992">1992</OPTION><OPTION value="1993">1993</OPTION><OPTION value="1994">1994</OPTION><OPTION value="1995">1995</OPTION><OPTION value="1996">1996</OPTION><OPTION value="1997">1997</OPTION><OPTION value="1998">1998</OPTION><OPTION value="1999">1999</OPTION><OPTION value="2000">2000</option>

</SELECT></td></table><BR>

<table><td valign="center">country:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type=text name="country"></td></table><br><table> <tr> <td valign="top">

<b>Terms of Service:</b>

Page 43: Project Report on e commerce website

</td> <td valign="top"> <font size="-1" > Please check the information you've entered above (feel free to change <br>anything you like), and review the Terms of Service below. you won't see blinking banner ads. Instead, we display ads you might find useful that arerelevant to the content of your messages.<br><td>&nbsp;</td></tr><td></td><td><br><font size="-1">

By clicking on 'I accept'below you are agreeing to the Terms of Service above. </font></td></tr></table>

<center><input type="button" value=" I Accept Create my account" onclick="return validate(form)"></center><br>

<div class="black-box"><br> <br>

<p class="more">&nbsp;</p> </div>

<div class="clear"></div></div>

</div></div>

</div></div>

</div>

<div class="clear"></div>

<div id="copyright">

Page 44: Project Report on e commerce website

<div align="center">Copyright information goes here. All rights reserved</div></div>

</div></form></body></html>

Page 45: Project Report on e commerce website

SIGN IN

Page 46: Project Report on e commerce website

<html><head><title>login form</title><link rel="stylesheet" href="style.css" type="text/css" charset="utf-8" /><script language="JavaScript" >

function login(){ var adoConn = new ActiveXObject("ADODB.Connection"); adoConn.Open("Provider=Microsoft.Jet.OLEDB.4.0;Data Source=C:/customer2.mdb"); alert("fileopen") var adoRS = new ActiveXObject("ADODB.Recordset"); adoRS.Open("Select * From cust", adoConn, 1, 3); strQuery = "SELECT * FROM cust where username='" + username + "'" + " and password='"+ pwd + "'"; adoRS.open(strQuery, conn, adOpenDynamic, adLockOptimistic);

if(!adoRS.bof){adoRS.MoveFirst();while(!adoRS.eof) {strHtml += "<tr>";strHtml += " <td><Font face ='tahoma'>Welcome " + username + "</font></td>";

strHtml += "</tr>";

adoRS.MoveNext();}else{strHtml += " <td><Font face ='tahoma'>Record not found</font></td>";}adoRS.Close(); adoConn.Close();

Page 47: Project Report on e commerce website

}</script></head>

<body>

<div id="wrapper">

<div id="header"><h1><a

href="index.html"><em>Clothes</em><strong>COLLECTION</strong></a></h1></div>

<div id="left-person"></div>

<div id="uppers">

<div id="nav-top"><ul>

<li><a href="site.html">Sign IN</a> |</li><li><a href="sign.html">Sign Up</a> |</li><li><a href="contact.html">Contact us</a></li>

</ul></div>

</div>

<div id="nav"><div><ul>

<li><a href="index.html"></a> &nbsp;|&nbsp;</li>

<li><a href="acc.html">ACCESSORIES</a> &nbsp;|&nbsp;</li>

<li><a href="men.html">MEN COLLECTION</a> &nbsp;|&nbsp;</li>

<li><a href="women.html">WOMEN COLLECTION</a> &nbsp;|&nbsp;</li>

<li><a href="kids.html">KIDS COLLECTION</a></li></ul>

</div></div>

<div id="body"><br><br><br><br><br>

Page 48: Project Report on e commerce website

</div>

<div id="black-tl"><div id="black-tr">

<div id="black-br"><div id="black-bl">

<div class="black-box"><FORM NAME="KANDY"

METHOD="GET"><P><font color=white><CENTER><H1>Sign In</H1></CENTER><br><br><B><div>User Name:<CENTER><INPUT TYPE="TEXT" NAME="username" ></CENTER></div><BR><b><div>Password :</div><center><INPUT TYPE="Password" NAME="pwd"></center><br><center><input type=button value="Log in" onclick="login()"><center>

</div>

<div class="black-box">

</div>

<div class="black-box">

</div>

<div class="clear"></div></div>

</div></div>

</div>

<div id="footer">

</div></div>

<div class="clear"></div>

<div id="copyright"> <div align="center">Copyright information goes here. All rights reserved</div>

Page 49: Project Report on e commerce website

</div>

</div></form></body></html>