讲解Web编程、辅导Java程序语言、Java编程调试
- 首页 >> Python编程Assignment 2
Semester 1, 2021
DUE ON: 11:59 PM, Wednesday 26 May 2021
Assignment Worth: 25% of total marks
NB: Assignments will be accepted up to five (5) days late, but a penalty of 5% per day (or part of a day) late
will be imposed on either the team or the individual depending on the circumstances.
NB: This is an individual assignment. Students are referred to the school’s policy on plagiarism. A confirmed
case will incur zero mark to all the involved students.
NB about naming standard:
- All file names must be consistent with what is specified in the assignment instruction.
o For Task 2.1, please use the same name “booking” for all types of files for this task. For
example, booking.html, booking.php, booking.js.
o For Task 2.2, please use the same name “admin” for all types of files for this task. For
example, admin.html, admin.php, admin.js.
o For the MySql table creation command, please write in mysqlcommand.txt
1. Overview
The aim of this assignment is to develop a better understanding of building web applications using
simple Ajax techniques, PHP, and MySQL. It assumes that you are able to work with MySQL and
PHP on the server, as learned in the first part and Assignment One of this course, and that you
can develop an Ajax client interface using HTML and JavaScript, as learned in the second part of
this course.
For this assignment, you will need to create all the appropriate HTML, JavaScript, PHP files and
Database tables. You should save and test all your HTML and PHP files on cmslamp14.aut.ac.nz
server in a directory "/home/
2. Assignment Tasks
The assignment is to develop a simple web-based taxi booking system called CabsOnline.
CabsOnline allows passengers to book taxi services from any of their internet connected
computers or mobile phones. The techniques you are going to use include the Ajax techniques
(JavaScript/HTML, XMLHttpRequest, CSS, and DOM), MySQL and PHP. For client-server
communication, you must use XMLHttpRequest object.
Two components (booking and admin) of such an online service that must be completed for this
assignment are specified in the following two sub-sections. Other components such as querying
service for drivers, monitoring services for customers, payment processing, detailed processing for
assigning taxi are not required in this assignment but you are free to extend for your fun later.
2.1 The Booking Component
This component is used to allow a passenger to put in a taxi booking request in Auckland and
surrounding areas.
1) On the client side, design an HTML page (booking.html) and a client-side program to take
inputs for a booking request, and pass them to server for processing (using XHR object). You
need to validate these inputs before sending them to the server:
• Customer Name (Text input type. Must set its name attribute to ”cname”:
2
• Phone Number (Text input type. Must set its name attribute to ”phone”:
with length between 10-12
• Unit Number (Text input type. Must set its name attribute to ”unumber”:
• Street Number (Text input type. Must set its name attribute to ”snumber”:
• Street Name (Text input type. Must set its name attribute to ”stname”:
• Suburb (Text input type. Must set its name attribute to ”sbname”:
• Destination Suburb (Text input type. Must set its name attribute to ”dsbname”:
. Optional)1
• Pick-Up Date (text or date input type. Must set its name attribute ”date”. NOT NULL,
should initially contain the current date in dd/mm/yyyy format e.g. 01/05/2021. This
can be edited by the user.
• Pick-up Time (text or time input type. Must set its name attribute ”time”. NOT NULL,
should initially contain the current time in 24h format HH:MM format e.g. 18:30. This
can be edited by the user.
Please note that the pick-up date and time must not be earlier than current date
and time on the client machine.
2) On the server side, for each booking request, a server-side program is required to generate a
unique booking reference number, booking date/time and a status with initial value
“unassigned”, and add them together with customer’s inputs into the MySQL table. In
addition, it is also required to return confirmation information to the client.
3) Design and create a MySQL table for storing information of all requests. For each request, you
need to store the generated booking number, customer’s inputs, the generated booking
date/time, and the generated status.
4) On the client side, upon receiving the returned information from the server, the client-side
program needs to display the returned confirmation information “Thank you! Your booking
reference number is
at
element must include a
element that uses the confirmation information
as its content.
2.2 The Admin Component
This component allows administrative people of CabsOnline to view those taxi booking requests
that need to be assigned as soon as possible and to assign taxi for a particular booking request.
Note that authentication is not required though it is necessary in the real application. If you provide
this function, you must provide the password and explain it in the readme document. The specific
functions of this component include:
1) Design an HTML page (admin.html) that takes two types of requests:
1
*** Note that it is not necessary to validate the genuineness of an address. But if you want to do that to make the
application more realistic, you can use google.maps.Geocoder() Web API. Please refer to Google Map API
online document or https://codepen.io/pavenuto/pen/dXkgEz on how to do that.
3
The first is to search booking requests and is realized by a single button to show pick-up
requests.
This search function has one text input field:
• Search Bookings (Text input type. Must set its name attribute to ”bsearch”:
. Optional). User can either input a
reference number or nothing:
i. If a reference number is input, then the booking record associated with this
reference number is returned by the server.
ii. If user input nothing (empty), then a list of bookings with a pick-up time within 2
hours from now is returned by the server (see below Item 3 for details).
• Search Button (button input type. Must set its name attribute to ”sbutton”:
The second is to assign taxi for a particular booking request (See Item 4 for details)
2) Once the button search booking is pressed, a client-side program issues a query request to
the server (using XHR object); once the button assign taxi is pressed, a client program
issues an assigning request to the server with a booking reference number.
3) On the server side, a server-side program responds differently for different types of
requests from the client:
a. For a request for showing pick-up requests, the server-side program executes a
query on the MySQL database for finding those “unassigned” booking requests
with a pick-up time within 2 hours from now only. For each found request, the
booking reference number, customer name, contact phone, pick-up suburb,
destination suburb, and pick-up date/time are required to return to the client.
b. For a request for assigning taxi, make an update to the MySQL database to change
the status of the booking request that matches the given booking reference number
from “unassigned” to “assigned”, and return confirmation information to the
client.
4) On the client side, for a request for showing pick-up requests, you display the returned
information in a
• Inside the div element is a element with the following table header fields exactly
as follows: “booking reference number”, “customer name”, “phone”, “pick-up suburb”,
“destination suburb”, and “pick-up date/time”, “status”, “assign”.
• Each table row must contain one record. For each row, the “assign” field must contain a
button with name “assign”, and when its clicked, the “status” of this record needs to be
updated on both the database and the html page.
Submission Requirements
You should ensure that all files used for the assignment sit in a directory called “assign2” (use this
name exactly, it is case sensitive and no space between assign and 2) within your cmslamp14
account. The directory should contain no sub-directories (i.e., all files are placed directly under the
“assign2” directory).
The assignment should be submitted as an individual work using the Assignment 2 link in
Blackboard (inside the Assignments area)
Please compress all your html and PHP files as a zip file named “assignment_2.zip” to
submit via Blackboard submission link. You can submit more than once.
The files should include:
• two HTML files booking.html and admin.html;
4
• any JavaScript files that you use;
• any CSS files that you use;
• any PHP files that you use;
• a text file “mysqlcommand.txt” that includes the MySQL commands that you used to create
the database;
• a text file readme.txt that includes
o a list of all the files in the system;
o brief instructions on how to use the system.
For each submitted file, we require clear comments including student information, description of
the file, and description of each function defined in this file.
The MySQL database that you use should be constructed in your cmslamp14 account. After
submission, you are not allowed to change any of the submitted files in the assign2 directory on
your cmslamp14 account; time stamps will be checked.
Assignments that fail to follow "submission requirements" will NOT be assessed.
Notes:
Please remove your database login details from the files before submitting to Blackboard to avoid
potential privacy breach.
Following is a guideline that you may follow to submit your assignment:
1. Make your code working on cmslamp14 server in the folder ‘assign2’
2. Download the folder (including all the files in it) to your local machine
3. If any PHP file in the folder contains your password then please replace the password
string with an empty string in a text editor
4. Make a zip archive of this folder and submit through Blackboard ‘Assignments” area
* Make sure to test your program on the cmslamp14 server before your submission.
* If your assignment cannot run on cmslamp14, your result will be 0 marks for this assignment.
Marking Scheme
Work will be assessed based on the quality and presentation. The assignment will be marked out
of 100 and will contribute 25% towards assessment of this course.
Assessment item Marks
comment and readme.doc 10
Quality of code 5
Usability of user interface 5
2.1.1 10
2.1.2 10
2.1.3 15
2.1.4 10
2.2.1 10
2.2.2 15
2.2.3 10
Total 100