代写 HTML, CSS, PHP, MySQL 编程

日期：2018-04-21 09:07

Assignment 2

要求：

1. The site has the following areas:

a. Home

b. Catalogue of products

c. Membership (Sign up, login, and logout)

d. Trolley with checkout

e. Admin area to be accessible only to an administrator

1 网页必须有下列部分：

主要

分类页

会员页（注册，登入，登出）

购物车，带有支付功能

管理员登入的管理页面

2 Different access levels for different user types:

a. Public user: has not signed up or logged in to the website.

b. General Member: requires a log in that is created upon sign up. This is the default level for a newly signed up user.

c. Administrator: logs in as an administrator.

用户有不同的访问级别

1 公共用户：还没有注册或者没有登入页面的用户

2 一般会员：在注册之后，需要登入。这是新注册用户的默认级别。

3 管理会员：需要管理员登入。

3. Membership Section contains login/logout and sign up:

If not a member yet, the user needs to sign up first. Once the user is logged in, they

must be kept logged in until they log out.

Following a successful login, more options such as “My Trolley” or “Admin” are

displayed as relevant to their user type. An admin option is not displayed for a

general member, for example.

会员页面需要有登入登出和注册功能：

不是会员的用户需要先注册。 一旦用户登入，直到他们登出之前，都需要保持登入状态。

当用户成功登入之后，在他们的页面上会有我的购物车或者我的会员页面。

4. All pages must contain the following sections:

a. Header section: This is to contain a relevant title of each page. For example, if the

page is ‘Catalogue page’, the title of the page is to be ‘Catalogue’.

b. Navigation section: Available links are displayed according to access level.

c. Main content section: This is to contain the relevant information for each page.

d. Footer section: Your name and student number.

所有的页面都必须包括以下板块

1 标题板块 每个页面都应该有对应的标题 分类页==》分类

2 导航板块 根据不同的访问级别，要有相应的连接

3 主要内容板块 各个页面相应的信息

4 页脚板块 名字和学号 YILIN WEN 453481

Check Point in Week 10 Tutorial

You must present your progress to your tutor in your assigned week 10 tutorial (week

commencing Monday 8th May) after completing the following:

??New members can sign up;

??Existing members can sign in and out;

??The header, footer and navigation sections are functioning (do not need to be

completed); and

??The tables in the database have been created.

2017.05.12 必须完成：

新会员能注册

现有会员能登入和登出

标题，页脚，导航板块能用

完成database需要的表

Further information is as follows:

具体要求

Home page

access level: all

Home page of the site

主页

访问等级：所有用户

网页主页建立完成

Catalogue page

access level: all

Information about the products for the site goes here.

*Note : You may have combined home and catalogue. This is acceptable.

分类页面

访问等级：所有用户

网页产品信息需要罗列出来

主页和分类页可以在一个网页上

Membership – Signup

access level: all

Users must join the site if they wish to proceed to purchase

??A Form containing the following input elements and each element should be

validated when the user enters something in each field:

(Every field should have the appropriate label)

o [Required field] Username –To be valid, the user must enter a value that

contains at least one letter and is not an existing username;

o [Required field] Password – To be valid, the user must enter a value that

contains at least 5 characters, which must not include any spaces (all other

characters are acceptable);

o [Required field] Re-type Password– To be valid, the user must enter a value

that is exactly the same entry as the first password entry;

o [Required field] Name – First and Last name;

o [Required field] Date of birth- Users are given 3 drop down lists (year,

month, and day field) to enter this (it must be a valid date – February

should have 28 or 29) – the options in the drop down lists must make it

possible to enter no date:

§ The month field should be shown when the year is selected.

§ The day field should be shown when the month is selected

§ The year range should be: 1900 – 2010

o [Optional field] Email – users can put in an email address, it must be valid;

o [Required field] ‘Gender’ field using radio buttons;

o [Required field] ‘Country’ field using select area (In the Country field,

you should include ‘USA’ and ‘Australia’, maximum 5 countries):

§ When the country is selected, the page should show:

o ‘State’ field using select area

(You do not need to put all states but at least three

states for each country)

§ If the country is not selected, you should not show the `State’

field

§ When the state is selected, the page should show:

o ‘City’ field using select area

(You do not need to put all cites but at least three

cities for each state)

§ If the country or state is not selected, you should not show the

`City` field

o ‘Submit’ button; and

o ‘Reset’ button.

??When the submit button is clicked,

o If all fields are valid,

§ The webpage lets the user know that the form is submitted.

§ The submitted form data needs to be saved into the table

‘customer’. The detailed table ‘customer’ can be found in the

‘Details of Tables Required’ section. (The default access level

should be 2)

o If any field is invalid,

§ The page should show all appropriate error messages (e.g. password

requires longer than 5 characters).

§ The entered data should remain in the field.

会员页面：

访问等级：所有用户  

用户必须在登入之后才能进行支付

注册需要的要素：

1 用户名 （必填）有效用户名：最少包含一个字母，并且是不存在在数据库的用户名

2 密码 （必填）有效密码：最少五个字符，不能用空格

3 确认密码 （re-type password）（必填）有效确认密码：必须和第一次输入的密码一样

4 名字（name）==》姓和名 （必填）

5 生日 （date of birth）（必填）三个下拉列表（年，月，日 2月到28或者29号）下拉列表不能直接输入数字：

1）选择年之后出现月份的

2）选择月之后出现日期

3）年：1900-2010

6 email （选填）用户能输入邮件地址，但必须是有效的

7 性别 （gender）（必填）使用单选框/单选按钮（radio buttons）

8 国家（country） （必填）使用选择面（select area），必须包括USA和Australia，最多五个国家

  选择了国家之后，页面会继续显示：

    州（state）使用选择面 一个国家最少有三个州

?如果没有选择国家，则不能显示州

?选择州之后，网页会显示一下内容：

城市（city）使用选择面（select area）一个州最少三个城市

如果没有选择州，则不能出现城市的选择

9. 提交键 submit

10. 重置键 reset

点击提交键之后：

1）如果所有填的内容是有效的，则：

网页需要让用户知道表格已经提交，

提交的数据需要上传并保存到myphpadmin表格‘用户 customer’中。

2）如果有内容无效，则：

页面需要显示不对的地方（比如：密码 需要多余五个字符）

已输入的数据还是保存在所填的位置

Membership Sign-In section

access level: member

??The form contains the following input elements and each element should be

validated when the user enters something in each field:

用户登入页面：

访问等级：已注册会员

页面需要包含以下元素，并且这些元素需要在用户在各个框中输入内容之后才能使用：

提交键 ‘Submit’ button

重置键 ‘Reset’ button

注册键 ‘Sign-up’ button

Trolley with Checkout

access level: member

This page must contain the items selected from the catalogue by the user. The list in

the trolley can be selected to proceed to the check out. The user will be brought back

to the home page when check out is completed.

??When the form is submitted (when the submit [Check out] button is clicked)

o Another form with basic information such as delivery address should

now be submitted, showing an error message if there is any empty

field in this form.

o The webpage should let the user know that the form has been

submitted.

o The submitted form data should be saved into the table ‘trolley’ in

database. The detailed table ‘trolley’ can be found in the ‘Details of

Table Required’ section.

购物车与结账

访问等级：会员

页面必须包括用户从分类页面选择的物品。购物车列表能选择进行结账。在结账完成之后，用户回到主页面。

提交页面之后（点击【check out】键）需要显示：

另一张有基本信息的表格，例如邮寄地址delivery address 如果这张表格有没有填的空格，需要显示错误信息 error message

网页在上一页面提交后需要告知用户

提交的数据需要上传并保存在“购物车trolley”数据库中。

Admin Area

access level: administrator

Administrators have the highest access level.

An administrator can change the stock information, i.e. number of stocks, price of stocks,

and change the access levels of members.

The administrator’s password must be encoded. (For marking purpose, please provide an

administrator username and password in “readme.txt”.)

管理页面

访问等级：管理员

管理员具有最高访问权限

管理员可以改变库存信息 例如：库存数量 商品价格 改变会员的访问等级

管理员的密码必须编码 （单独提交一个readme.txt，记录管理员的用户名和密码）

Details of programming style

??All semantic structure of the website should be controlled by “HTML”. You should use

HTML 5. You should pay particular attention to the elements that you use - make sure

that you use the most appropriate element for the kind of text you are marking up;

??All layout and other details of the appearance of the website should be controlled by

valid CSS (Cascading Style Sheets) rules. You should place CSS rules in an external style

sheet (no inline or internal style);

??All behavior of the website (the response to mouse clicking or keyboard reaction) should

be controlled by valid JavaScript (jQuery);

??If you use the jQuery plugins developed by others, you specify which plugins you used in

the readme.txt file. (You will get only half the possible mark for the related section);

??For this assignment, you should use PHP for server-side scripting. Uses built-in PHP

functions where possible;

??You should use the MySQL database on alacritas server. The detailed table structure can

be found from “Details of Table Required” section;

??If you use your computer or your own server to develop the assignment, please test your

work on the alacritas server using a browser available in the lab before your submission;

??All references (URI values) within the site are relative. Do NOT use absolute URL;

??Readme.txt is to contain an administrator’s credentials;

??The only tools to be used for the assignment are HTML, CSS, jQuery, PHP, and MySQL.

NO Bootstrap or other resources.

编程风格：

1）所有的语义结构使用HTML，必须使用HTML5.

2）所有的布局已经网页外观的其他内容都需要使用CSS 使用外部CSS

3）所有的网页行为（behavior of the website）（响应鼠标点击或者键盘输入）需要使用javascript（jquery）

4）如果使用其他人写出的jquery插件，需要在readme.txt中注明

5）服务器端脚本使用php。 使用内置php

6）使用alacritas server的MySQL database

7）所有的reference（URI值）需要相对的（relative）， 不能使用绝对值

8）readme.txt需要包含管理员信任状（credentials）

9）只能使用HTML,CSS,JQUERY,PHP及MYSQL 不能使用Bootstrap或者其他工具。