Pillai College of Engineering
Web Programming Question Bank
Academic Year 2023-24
[Link] Statement:
You are required to create an event registration form for an upcoming dance
competition. The form should include the following fields:
HTML Structure:
● Username: Input field for the participant's username.
● Password: Input field for the participant's password.
● Confirm Password: Input field to confirm the participant's password.
● Email Address: Input field for the participant's email address.
● Mobile Number: Input field for the participant's mobile number.
● Gender: Radio buttons to select participant's gender (Male/Female/Other).
● Date of Birth: Input field for the participant's date of birth.
● Address: Text area for the participant's address.
● Submit Button: Button to submit the registration form.
CSS Styling:
● Apply CSS for the form elements to style them appropriately.
JavaScript Validation:
● Validate the email address format.
● Validate the mobile number field to accept only 10-digit numbers.
PHP Integration:
Create a PHP script to process the registration form data. Perform the following
operations:
● Accept and display the username, email address, mobile number, gender, date of
birth, and address entered by the participant.
● Validate the email address format.
Q2. Problem Statement:
You are required to create a registration form for a workshop on digital marketing. The
form should include the following fields:
HTML Structure:
● Full Name: Input field for the participant's full name.
● Email Address: Input field for the participant's email address.
● Company Name: Input field for the participant's company name.
● Job Title: Input field for the participant's job title.
● Phone Number: Input field for the participant's phone number.
● Workshop Date: Input field for selecting the workshop date.
● Number of Attendees: Input field for specifying the number of attendees from the
company.
● Special Requests: Text area for any special requests or requirements.
● Submit Button: Button to submit the registration form.
CSS Styling:
● Apply CSS for the form elements to style them appropriately.
JavaScript Validation:
● Validate the email address format.
● Ensure that the workshop date is not in the past.
PHP Integration:
Create a PHP script to process the registration form data. Perform the following
operations:
● Accept and display the participant's full name, email address, company name, job
title, phone number, workshop date, number of attendees, and special requests.
● Provide a confirmation message to the participant upon successful registration.
Q3. Problem Statement:
You are required to create a registration form for volunteers interested in participating
in a local community event. The form should include the following fields:
HTML Structure:
● Full Name: Input field for the volunteer's full name.
● Email Address: Input field for the volunteer's email address.
● Phone Number: Input field for the volunteer's phone number.
● Availability: Checkboxes for selecting the volunteer's availability (Morning,
Afternoon, Evening, Weekend).
● Area of Interest: Dropdown menu for selecting the volunteer's area of interest
(e.g., Event Setup, Registration, Clean-up, etc.).
● Additional Comments: Text area for any additional comments or information.
● Submit Button: Button to submit the registration form.
CSS Styling:
● Apply CSS for the form elements to style them appropriately.
JavaScript Validation:
● Validate the email address format.
● Ensure at least one availability option is selected.
PHP Integration:
Create a PHP script to process the registration form data. Perform the following
operations:
● Accept and display the volunteer's full name, email address, phone number,
availability, area of interest, and additional comments.
● Provide a confirmation message to the volunteer upon successful registration.
Q4. Problem Statement:
You are required to create a grade calculator form for students to calculate their final
grade based on their scores in different subjects. The form should include the
following fields:
HTML Structure:
● Student Name: Input field for the student's name.
● Subject 1 Score: Input field for entering the score of subject 1.
● Subject 2 Score: Input field for entering the score of subject 2.
● Subject 3 Score: Input field for entering the score of subject 3.
● Subject 4 Score: Input field for entering the score of subject 4.
● Subject 5 Score: Input field for entering the score of subject 5.
● Calculate Button: Button to calculate the final grade.
CSS Styling:
● Apply CSS for the form elements to style them appropriately.
JavaScript Validation:
● Validate each score field to accept only numeric values between 0 and 100.
● Ensure that all score fields are filled before allowing calculation.
PHP Integration:
Create a PHP script to process the grade calculation. Perform the following operations:
● Accept and display the student's name and scores for each subject.
● Calculate the average score based on the input scores.
● Determine the final grade based on the average score using the following grading
scale:
● A: 90-100
● B: 80-89
● C: 70-79
● D: 60-69
● F: Below 60
● Display the final grade to the student.
Q5. Problem Statement:
You are required to create a GPA calculator form for students to compute their GPA
based on the grades received in various courses. The form should include the
following fields:
HTML Structure:
● Student Name: Input field for the student's name.
● Course 1 Grade: Input field for entering the grade received in course 1 (e.g., A, B,
C, D, F).
● Course 2 Grade: Input field for entering the grade received in course 2.
● Course 3 Grade: Input field for entering the grade received in course 3.
● Course 4 Grade: Input field for entering the grade received in course 4.
● Course 5 Grade: Input field for entering the grade received in course 5.
● Calculate GPA Button: Button to calculate the GPA.
CSS Styling:
● Apply CSS for the form elements to style them appropriately.
JavaScript Validation:
● Validate each grade field to accept only valid grade letters (A, B, C, D, F)
● Ensure that all grade fields are filled before allowing GPA calculation.
PHP Integration:
Create a PHP script to process the GPA calculation. Perform the following operations:
● Accept and display the student's name and grades for each course.
● Calculate the GPA based on the input grades using the standard GPA scale.
● Display the calculated GPA to the student.
GPA = Σ (Grade Points) / Σ (Credit Hours)
Σ (Grade Points) is the sum of the grade points earned in all courses.
Σ (Credit Hours) is the sum of the credit hours for all courses. (Assume random credit
hours for each course for calculation)
[Link] Statement:
You are required to create a book order form for users to order books from an online
bookstore. The form should include the following fields:
HTML Structure:
● Book Title: Input field for entering the title of the book.
● Author: Input field for entering the author of the book.
● Price: Input field for entering the price of the book.
● Quantity: Input field for entering the quantity of books to order.
● Order Button: Button to submit the book order.
CSS Styling:
● Apply CSS for the form elements to style them appropriately.
JavaScript Validation:
● Validate each input field to ensure that it is not empty before allowing
submission.
● Validate the price field to accept only numeric values greater than zero.
● Validate the quantity field to accept only positive integer values.
● Ensure that the quantity field is not empty and the quantity entered is within a
reasonable range (e.g., between 1 and 10).
PHP Integration:
Create a PHP script to process the book order. Perform the following operations:
● Accept and display the book title, author, price, and quantity entered by the user.
● Calculate the total cost of the order by multiplying the price by the quantity.
● Display the total cost and confirmation message to the user upon successful
submission.
Q7. Problem Statement:
You are required to create a product review submission form for users to share their
feedback on products purchased from an online store. The form should include the
following fields:
HTML Structure:
● Product Name: Input field for entering the name of the product.
● Reviewer Name: Input field for entering the name of the reviewer.
● Reviewer Email: Input field for entering the email of the reviewer.
● Rating: Dropdown menu or radio buttons for selecting the rating of the product
(e.g., 1 to 5 stars).
● Review Text: Text area for entering the detailed review.
● Submit Button: Button to submit the review.
CSS Styling:
● Apply CSS for the form elements to style them appropriately.
JavaScript Validation:
● Validate each input field to ensure that it is not empty before allowing
submission.
● Validate the rating field to ensure that a rating is selected.
● Ensure that the review text field is not empty.
PHP Integration:
Create a PHP script to process the review submission. Perform the following
operations:
● Accept and display the product name, reviewer name, rating, and review text
entered by the user.
● Validate the email address format.
● Provide a confirmation message to the user upon successful submission.
Q8. Problem Statement:
You are required to create a product inventory tracker form for users to update the
inventory levels of products in an online store. The form should include the following
fields:
HTML Structure:
● Product Name: Input field for entering the name of the product.
● Quantity In Stock: Input field for entering the current quantity of the product in
stock.
● New Stock Quantity: Input field for entering the additional quantity to be added to
the stock.
● Supplier: Input field for entering the supplier name.
● Cost Per Unit: Input field for entering the cost per unit of the product.
● Update Button: Button to update the inventory.
CSS Styling:
● Apply CSS for the form elements to style them appropriately.
JavaScript Validation:
● Validate each input field to ensure that it is not empty before allowing
submission.
● Validate the quantity fields to accept only positive integer values.
PHP Integration:
Create a PHP script to process the inventory update. Perform the following operations:
● Accept and display the product name, current quantity in stock, new stock
quantity, supplier name, and cost per unit entered by the user.
● Calculate the updated inventory level by adding the new stock quantity to the
current quantity. (Assume random quantity)
● Calculate the total cost of the new stock based on the cost per unit and new
stock quantity.
● Display the updated inventory level and total cost to the user.
Q9. Problem Statement:
You are required to create a monthly budget tracker form for users to manage their
expenses and income for a month. The form should include the following fields:
HTML Structure:
● Monthly Income: Input field for entering the total monthly income.
● Rent Expense: Input field for entering the rent expense.
● Groceries Expense: Input field for entering the groceries expense.
● Transportation Expense: Input field for entering the transportation expense.
● Entertainment Expense: Input field for entering the entertainment expense.
● Utilities Expense: Input field for entering the utilities expense.
● Save Button: Button to save the budget details.
CSS Styling:
● Apply CSS for the form elements to style them appropriately.
JavaScript Validation:
● Validate each input field to ensure that it is not empty and accept valid numerical
values.
● Ensure that the monthly income field is not empty and accepts only positive
numerical values.
PHP Integration:
Create a PHP script to process the budget details. Perform the following operations:
● Accept and display the monthly income and expenses entered by the user.
● Calculate the total expenses by summing up all the expense fields.
● Calculate the remaining budget by subtracting the total expenses from the
monthly income.
● Display the total expenses and remaining budget to the user.
Q10. Problem Statement:
You are required to create a product comparison and recommendation form for users
to compare features, prices, and receive recommendations for different products. The
form should include the following fields:
HTML Structure:
● Product Name 1: Input field for entering the name of product 1.
● Product Price 1: Input field for entering the price of product 1.
● Product Rating 1: Input field for entering the rating of product 1
● Product Name 2: Input field for entering the name of product 2.
● Product Price 2: Input field for entering the price of product 2.
● Product Rating 2: Input field for entering the rating of product 2.
● Compare Button: Button to compare the products and receive recommendations.
CSS Styling:
● Apply CSS for the form elements to style them appropriately.
JavaScript Validation:
● Validate each input field to ensure that it is not empty and accepts valid values.
● Ensure that the price fields accept only positive numerical values.
● Ensure that the rating fields accept only numerical values within a specified range
(e.g., 1 to 5 for star ratings).
PHP Integration:
Create a PHP script to process the product comparison and recommendation. Perform
the following operations:
● Accept and display the names, prices, and ratings of the two products entered by
the user.
● Determine which product is cheaper or if they have the same price.
● Based on the ratings of the products, provide recommendations to the user (e.g.,
"Product 1 has a higher rating. You may prefer it for its better quality.").
● Display the comparison result and recommendations to the user.
Q11. Problem Statement:
You are required to create a stock management system form for retail stores to track
inventory levels and order new stock. The form should include the following fields:
HTML Structure:
● Product Name: Input field for entering the name of the product.
● Current Quantity: Input field for displaying the current quantity of the product in
stock (read-only).
● Quantity to Order: Input field for entering the quantity of new stock to order.
● Supplier: Input field for entering the supplier name.
● Cost Per Unit: Input field for entering the cost per unit of the product.
● Order Button: Button to place the order for new stock.
CSS Styling:
● Apply CSS for the form elements to style them appropriately.
JavaScript Validation:
● Validate the quantity to order field to accept only positive integer values.
● Validate each input field to ensure that it is not empty before allowing
submission.
PHP Integration:
Create a PHP script to process the stock order. Perform the following operations:
● Accept and display the product name, current quantity in stock, quantity to order,
supplier name, and cost per unit entered by the user.
● Calculate the total cost of the new stock based on the cost per unit and quantity
to order.
● Update the inventory level (assume any existing inventory data)by adding the
quantity to order to the current quantity.
● Provide a confirmation message to the user upon successful stock order.
Q12. Problem Statement:
You are required to create an equipment rental management form for businesses to
manage rental inventory. The form should include the following fields:
HTML Structure:
● Equipment Name: Input field for entering the name of the equipment.
● Available Quantity: Input field for displaying the current available quantity of the
equipment for rental (read-only).
● Quantity to Rent: Input field for entering the quantity of equipment to rent.
● Rental Duration: Input field for entering the duration of the rental period (in days).
● Customer Name: Input field for entering the name of the customer renting the
equipment.
● Rent Button: Button to confirm the rental.
CSS Styling:
● Apply CSS for the form elements to style them appropriately.
JavaScript Validation:
● Validate the quantity to rent field to accept only positive integer values.
● Validate the rental duration field to accept only positive integer values.
● Validate each input field to ensure that it is not empty before allowing
submission.
PHP Integration:
Create a PHP script to process the equipment rental. Perform the following operations:
● Accept and display the equipment name, available quantity, quantity to rent,
rental duration, and customer name entered by the user.
● Update the available quantity of the equipment by subtracting the quantity
rented.
● Calculate the rental fee based on the rental duration and quantity rented.
● Provide a confirmation message to the user upon successful equipment rental.
Q13. Problem Statement:
You are required to create an ingredient inventory management form for restaurants to
track ingredient levels and order new stock. The form should include the following
fields:
HTML Structure:
● Ingredient Name: Input field for entering the name of the ingredient.
● Current Quantity: Input field for displaying the current quantity of the ingredient in
stock (read-only).
● Quantity to Order: Input field for entering the quantity of new stock to order.
● Supplier: Input field for entering the supplier name.
● Cost Per Unit: Input field for entering the cost per unit of the ingredient.
● Order Button: Button to place the order for new stock.
CSS Styling:
● Apply CSS for the form elements to style them appropriately.
JavaScript Validation:
● Validate the quantity to order field to accept only positive integer values.
● Validate each input field to ensure that it is not empty before allowing
submission.
PHP Integration:
Create a PHP script to process the ingredient order. Perform the following operations:
● Accept and display the ingredient name, current quantity in stock, quantity to
order, supplier name, and cost per unit entered by the user.
● Calculate the total cost of the new stock based on the cost per unit and quantity
to order.
● Update the ingredient inventory level by adding the quantity to order to the
current quantity. (Assume initial inventory level)
● Provide a confirmation message to the user upon successful stock order.
Q14. Problem Statement:
You are required to create a medical supply request form for healthcare facilities to
request new medical supplies. The form should include the following fields:
HTML Structure:
● Supply Name: Input field for entering the name of the medical supply.
● Current Quantity: Input field for displaying the current quantity of the medical
supply in stock (read-only).
● Quantity to Request: Input field for entering the quantity of new supplies to
request.
● Supplier: Input field for entering the supplier name.
● Estimated Delivery Date: Input field for entering the estimated delivery date of the
requested supplies.
● Request Button: Button to submit the supply request.
CSS Styling:
● Apply CSS for the form elements to style them appropriately.
JavaScript Validation:
● Validate the quantity to request field to accept only positive integer values.
● Validate each input field to ensure that it is not empty before allowing
submission.
PHP Integration:
Create a PHP script to process the supply request. Perform the following operations:
● Accept and display the supply name, current quantity in stock, quantity to
request, supplier name, and estimated delivery date entered by the user.
● Provide a confirmation message to the user upon successful supply request and
display the updated quantity.
Q15. Problem Statement:
You are required to create a conference room reservation form for employees to
reserve conference rooms. The form should include the following fields:
HTML Structure:
● Room Name: Input field for entering the name of the conference room.
● Reservation Date: Input field for selecting the desired reservation date.
● Start Time: Input field for selecting the start time of the reservation.
● End Time: Input field for selecting the end time of the reservation.
● Employee Name: Input field for entering the name of the employee making the
reservation.
● Reason for Reservation: Input field for entering the reason for the reservation.
● Reserve Button: Button to reserve the conference room.
CSS Styling:
● Apply CSS for the form elements to style them appropriately.
JavaScript Validation:
● Validate each input field to ensure that it is not empty before allowing
submission.
● Ensure that the end time is after the start time.
PHP Integration:
● Create a PHP script to process the conference room reservation. Perform the
following operations:
● Accept and display the room name, reservation date, start time, end time,
employee name, and reason for reservation entered by the user.
● Check for any scheduling conflicts with existing reservations.
● Calculate the duration of the reservation.
● Provide a confirmation message to the user upon successful room reservation.
Q16. Problem Statement:
You are required to create a vehicle rental reservation form for customers to reserve
vehicles. The form should include the following fields:
HTML Structure:
● Vehicle Type: Dropdown menu for selecting the type of vehicle to rent.
● Pickup Date: Input field for selecting the desired pickup date.
● Return Date: Input field for selecting the desired return date.
● Customer Name: Input field for entering the name of the customer making the
reservation.
● Contact Number: Input field for entering the contact number of the customer.
● Reserve Button: Button to reserve the vehicle.
CSS Styling:
● Apply CSS for the form elements to style them appropriately.
JavaScript Validation:
● Validate each input field to ensure that it is not empty before allowing
submission.
● Ensure that the return date is after the pickup date.
PHP Integration:
● Create a PHP script to process the vehicle rental reservation. Perform the
following operations:
● Accept and display the vehicle type, pickup date, return date, customer name, and
contact number entered by the user.
● Check for any scheduling conflicts with existing reservations.
● Calculate the rental duration.
● Provide a confirmation message to the user upon successful vehicle reservation.
Q17. Problem Statement:
You are required to create an expense tracking system with budget calculation for
users to track their expenses and manage budgets. The system should include the
following features:
HTML Structure:
● Expense Description: Input field for entering the description of the expense.
● Expense Amount: Input field for entering the amount of the expense.
● Expense Date: Input field for selecting the date of the expense.
● Add Expense Button: Button to add the expense to the tracker.
● Budget Amount: Input field for entering the total budget amount.
● Calculate Button: Button to calculate the remaining budget.
● Remaining Budget: Field to display the remaining budget after deducting the total
expenses.
CSS Styling:
Apply CSS for the form elements to style them appropriately.
JavaScript Validation:
● Validate the expense amount field to accept only numerical values.
PHP Integration:
● Create a PHP script to process the expense tracking and budget calculation.
Perform the following operations:
● Accept and display the expense description, amount, and date entered by the
user.
● Calculate the total expenses based on the expenses entered by the user.
● Calculate the remaining budget by deducting the total expenses from the total
budget amount.
● Display the remaining budget to the user upon clicking the calculate button.
● Provide a confirmation message to the user upon successful expense addition
and budget calculation.
Q18. Problem Statement:
You are required to create a fitness tracker with calorie calculation for users to track
their daily activities and monitor calorie intake.
HTML Structure:
● Activity Type: Dropdown menu for selecting the type of activity (e.g., running,
walking, cycling).
● Duration (in minutes): Input field for entering the duration of the activity.
● Intensity Level: Radio buttons for selecting the intensity level of the activity (e.g.,
low, moderate, high).
● Add Activity Button: Button to add the activity to the tracker.
● Calorie Intake Goal: Input field for entering the daily calorie intake goal.
● Calculate Button: Button to calculate the total calorie intake and remaining
calorie goal.
● Total Calorie Intake: Field to display the total calorie intake based on the activities
entered.
● Remaining Calorie Goal: Field to display the remaining calorie goal after
deducting the total calorie intake from the goal.
CSS Styling:
● Apply CSS for the form elements to style them appropriately.
JavaScript Validation:
● Validate the duration field to accept only positive integer values.
PHP Integration: Create a PHP script to process the fitness tracking and calorie
calculation. Perform the following operations:
● Accept and display the activity type, duration, and intensity level entered by the
user.
● Calculate and display the calorie burned for each activity based on the duration
and intensity level.
● Calculate and display the total calorie intake based on the activities entered.
● Provide a confirmation message to the user upon successful activity addition
and calorie calculation.
Q19. Problem Statement:
You are required to create an investment portfolio tracker with ROI calculation for
users to track their investments and calculate returns. The system should include the
following features:
HTML Structure:
● Investment Name: Input field for entering the name of the investment.
● Investment Amount: Input field for entering the amount invested.
● Investment Date: Input field for selecting the date of the investment.
● Current Value: Input field for entering the current value of the investment.
● Add Investment Button: Button to add the investment to the tracker.
● Total Investment Amount: Field to display the total amount invested.
● Total Current Value: Field to display the total current value of investments.
● Return on Investment (ROI): Field to display the return on investment percentage.
CSS Styling:
● Apply CSS for the form elements to style them appropriately.
JavaScript Validation:
● Validate the investment amount and current value fields to accept only numerical
values.
● Ensure that all input fields are filled before allowing submission.
PHP Integration:
● Create a PHP script to process the investment tracking and ROI calculation.
Perform the following operations:
● Accept and display the investment name, amount, date, and current value entered
by the user.
● Calculate and display the total amount invested and total current value of
investments.
● Calculate and display the return on investment (ROI) percentage based on the
total investment amount and total current value.
● Provide a confirmation message to the user upon successful investment addition
and ROI calculation.
Q20. Problem Statement:
You are required to create a meal planner with nutrition calculation for users to plan
their meals and track nutritional intake. The system should include the following
features:
HTML Structure:
● Meal Name: Input field for entering the name of the meal.
● Calories: Input field for entering the calorie count of the meal.
● Protein: Input field for entering the protein content of the meal.
● Carbohydrates: Input field for entering the carbohydrate content of the meal.
● Fat: Input field for entering the fat content of the meal.
● Calculate Button: Button to calculate nutritional content of the meal.
● Nutritional Content : Input field for nutritional content of the meal.
CSS Styling:
● Apply CSS for the form elements to style them appropriately.
JavaScript Validation:
● Validate the calorie, protein, carbohydrate, and fat fields to accept only numerical
values.
● Ensure that all input fields are filled before allowing submission.
PHP Integration:
● Create a PHP script to process the meal planning and nutrition calculation.
Perform the following operations:
● Accept and display the meal name, calories, protein, carbohydrates, and fat
entered by the user.
● Calculate the nutritional content for all meals.
● Display the total nutritional intake to the user upon clicking the calculate button.
● Provide a confirmation message to the user upon successful nutrition
calculation.
