{tocify} $title={Table of Contents}
Insert data into database using PHP and html.
Introduction:
The following project is to enter student data in the college database.
For this project you need to have some information.
- HTML (HTML Form input types).
- PHP (PHP Variables, PHP Database connection).
- SQL Queries.
The following steps are required to design a student details form.
Step-1: install a virtual server on your system(computer) (eg. XAMPP or WAMP).
- XAMPP is a free and open-source cross-stage web server arrangement stack bundle created by Apache Friends, comprising chiefly of the Apache HTTP Server, MySQL information base, and translators for scripts written in the PHP and Perl programming language.
Step-2: install the required an editor where the HTML code has to be written. You can use any editor (such as VS Code, Notepad++, etc. ). Here we will use VS code.
Step-3: Open the VS code text editor and type the HTML code to design the page to enter the student details.
Write this HTML code in your text editor:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PoorWebDev</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="form-container">
<form action="insert.php" method="post">
<div class="form-input">
<label for="">Student Name</label>
<input type="text" name="name" id="">
<label for="">Student Surmane</label>
<input type="text" name="Surmane" id="">
<label for="">Student Age</label>
<input type="number" name="Surmane" id="">
<label for="">City</label>
<input type="text" name="Surmane" id="">
<label for="">Email</label>
<input type="email" name="Surmane" id="">
<label for="">Mobile Number</label>
<input type="text" name="Surmane" id="">
</div>
<input type="submit" value="Submit">
</form>
</div>
</body>
</html>Write this CSS code in your text editor:
Apply the basic CSS in HTML code:
*{
margin:0;padding:0;
box-sizing: border-box;
}
.form-container{
width:100%;
height:100vh;
display:flex;align-items:center;justify-content:center
}
.form-input{
display:grid;
grid-template-columns:repeat(2,1fr);
grid-gap:5px;
}
input[type="submit"]{
width:100%;
margin-top:10px;
border:none;
background:#6ea1ff;color: #ffff;
padding:8px 0;
height:auto;
}
input{
height:25px;
border-radius:4px;
outline:none;
border:1px solid gray;
}
View your page in browser:
Step-4: Open XAMPP control panel and the start Apache and MySQL server.
Step-5: Open the browser and type: http://localhost/phpmyadmin
- Create a database (database name – college).
- Create a table (Table name – student).
- Add one column for ID and assign primary key.
PHP Code:
Note:-
- Before doing this project you need to know basic php code and php variables.
- I hope you know the basic php code and php variables.
PHP
- Open your code editor and create a file named insert.php
- Write the following php code in your insert.php file.
<?php
$conn =mysqli_connect("localhost","root","","college");
if(!$conn){
echo "Error";
}
$name=$_POST["name"];
$surmane=$_POST["surmane"];
$age=$_POST["age"];
$city=$_POST["city"];
$email=$_POST["email"];
$mobile=$_POST["mobileno"];
$q="insert into student(name,Surname,Age,City,Email,Mobile_no)
values('$name','$surmane','$age','$city','$email','$mobile')";
mysqli_query($conn,$q);
header ("location: Student.html");
?>Screenshot:
- Data is passed to php file using POST variable.
- Data has been successfully entered in the student table.
I hope you enjoyed this post.
Related Post:
PHP introduction Click hear.
Update ,Delete Data in server using php Click hear
HTML introduction Click hear.