diff options
author | Saumit Dinesan <justsaumit@protonmail.com> | 2023-08-24 22:52:23 +0530 |
---|---|---|
committer | Saumit Dinesan <justsaumit@protonmail.com> | 2023-08-24 22:52:23 +0530 |
commit | f5e5cfa6c26e6f41af74c33a5a6726e50ef164f1 (patch) | |
tree | c0a3b93b0af000933071da36351e2f9c7488b8b2 | |
parent | 97e177c102a0bd32580c5f8b99d620924dae4a61 (diff) |
Lab03 - Create a Registration form using HTML Forms
-rw-r--r-- | Lab03/README.md | 36 | ||||
-rw-r--r-- | Lab03/index.html | 40 | ||||
-rw-r--r-- | Lab03/insert.php | 42 | ||||
-rw-r--r-- | Lab03/screenshot-lab03.png | bin | 0 -> 36044 bytes | |||
-rw-r--r-- | Lab03/style.css | 12 |
5 files changed, 130 insertions, 0 deletions
diff --git a/Lab03/README.md b/Lab03/README.md new file mode 100644 index 0000000..fad07c2 --- /dev/null +++ b/Lab03/README.md @@ -0,0 +1,36 @@ +# Lab03: Registration Form Webpage +This directory contains the necessary files for a simple registration form webpage. +The registration form collects various details from the user, such as their first name, last name, gender, registration number, phone number, email address, and department. + +## Table of Contents + +- [Description](#description) +- [To-Do List](#to-do-list) +- [Brief Look](#brief-look) + +## Description + +The HTML code in this directory defines a basic registration form with the following input fields: + +- First Name +- Last Name +- Gender +- Registration Number +- Phone Number +- Email Address +- Department + +Users can input their information and select their department from the provided radio buttons. Upon submission, the form data is sent to the "/insert.php" endpoint using the HTTP POST method. + +The portfolio website provides a brief introduction about me, my skills, projects and how to contact me. It is built using basic HTML and CSS and makes use of HTML Tables to showcase my work in a clean and organized manner. + +## Brief Look +Here is a screenshot of the current look of the website: +![Website Screenshot](screenshot-lab03.png) + +## To-Do List + +- [x] Create the HTML registration form. +- [x] Create an `insert.php` file. +- [ ] Configure the `insert.php` file to connect to the MySQL server. +- [ ] Write PHP code in `insert.php` to handle form data and insert it into the database. diff --git a/Lab03/index.html b/Lab03/index.html new file mode 100644 index 0000000..61b14e5 --- /dev/null +++ b/Lab03/index.html @@ -0,0 +1,40 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <link rel="stylesheet" href="style.css"> + <title>HTML Form Creation</title> +</head> +<body> + <h1>Registration Form</h1> + <form action="/insert.php" method="post"> + <label for="fname">First name:</label><br> + <input type="text" id="fname" name="fname"><br> + <label for="lname">Last name:</label><br> + <input type="text" id="lname" name="lname"><br> + <label for="gender">Gender:</label><br> + <input type="text" id="gender" name="gender"><br> + <label for="regno">Registration Number:</label><br> + <input type="number" id="regno" name="regno"><br> + <label for="phone">Phone Number:</label><br> + <input type="number" id="phone" name="phone"><br> + <label for="email">Email Address:</label><br> + <input type="email" id="email" name="email"><br> + <br> + <label for="Department">Department: </label><br> + <input type="radio" id="it" name="department" value="IT"> + <label for="it">Information Technology</label><br> + <input type="radio" id="cse" name="department" value="CSE"> + <label for="cse">Computer Science and Engineering</label><br> + <input type="radio" id="mech" name="department" value="MECH"> + <label for="mech">Mechanical Engineering</label><br> + <input type="radio" id="civil" name="department" value="CIVIL"> + <label for="civil">Civil Engineering</label><br> + <input type="radio" id="ece" name="department" value="ECE"> + <label for="ece">Electronics and Communication Engineering</label><br> + <br> + <input type="submit" value="Submit"> + </form> +</body> +</html>
\ No newline at end of file diff --git a/Lab03/insert.php b/Lab03/insert.php new file mode 100644 index 0000000..a7efb70 --- /dev/null +++ b/Lab03/insert.php @@ -0,0 +1,42 @@ +<?php + +$servername = "localhost"; +$username = "db_user"; +$password = "password123"; +$dbname = "regform"; + +// Create connection +$conn = new mysqli($servername, + $username, $password, $dbname); + +// Check connection +if ($conn->connect_error) { + die("Connection failed: " + . $conn->connect_error); +} + +$fname = $_REQUEST['fname']; +$lname = $_REQUEST['lname']; +$gender = $_REQUEST['gender']; +$regno = $_REQUEST['regno']; +$phone = $_REQUEST['phone']; +$email = $_REQUEST['email']; +$department = $_REQUEST['department']; + +$sql = "INSERT INTO $dbname VALUES ('$fname','$lname','$gender','$regno','$email',$department)"; + +if(mysqli_query($conn, $sql)){ + echo "<h3>data stored in a database successfully." + . " Please browse your localhost php my admin" + . " to view the updated data</h3>"; + + echo nl2br("\n$first_name\n $last_name\n " + . "$gender\n $address\n $email"); +} else{ + echo "ERROR: Could not insert the data values $sql. " + . mysqli_error($conn); +} + +// Close connection +mysqli_close($conn); +?>
\ No newline at end of file diff --git a/Lab03/screenshot-lab03.png b/Lab03/screenshot-lab03.png Binary files differnew file mode 100644 index 0000000..86d70be --- /dev/null +++ b/Lab03/screenshot-lab03.png diff --git a/Lab03/style.css b/Lab03/style.css new file mode 100644 index 0000000..88fa56f --- /dev/null +++ b/Lab03/style.css @@ -0,0 +1,12 @@ +html { + font-family: sans-serif; + margin-top: 1%; + margin-left: 3%; + background-color: whitesmoke; + margin-right: auto; + } + +h1 { + text-decoration: underline; + font-size: 1.9rem; +}
\ No newline at end of file |