How to send users information to php mysqli database using html form
The world has gotten to
the point where web developers can’t really do much without back-end
development. No matter the kind of website you’re building, you must deal with
database, so in this very article, we’ll be talking about writing some php
script to enable us send users information into php mysqli database.
We’ll first build html
form that will help hold the information that will be send to the database,
secondly, we’ll write some line php codes to trigger the action when a user
click the send button on the html form.
I believe you already know
much about how to create html form. Anyways, even though you’re very good at
it, we will still make it available to make balance understanding for both new
and old developers.
First we will make the HTML
form with two input fields, one to hold user’s email and the second one is for
user’s mobile number. Then we’ll use CSS to style the form a bit and we move
over to php for the action script.
HTML form example;
<!DOCTYPE html>
<html
lang="en">
<head>
<meta
http-equiv="Content-Type" content="text/html;
charset=utf-8">
<title>Sign
In</title>
<style
type="text/css">
</style>
</head>
<body>
<form
method="POST" class="signup-form-class">
<label>email</label><br
/>
<input
type="text" name="email" placeholder="enter
email" class="input-style"/><br /><br />
<label>Enter
Phone number</label><br />
<input
type="text" name="number" placeholder="enter phone
number" class="input-style"/><br /><br />
<input
type="submit" name="submit" value="send" class="submit-style"/><br
/><br />
</form>
</body>
</html>
This file should be saving
as form.html. The second step from here is to create another file call
style.css.
Related articles:
How to create web app chat system from scratch
How to master php valuables and data
How to know the difference between
programming and web development
Note: the style.css file
should contain the styles for the form and will be linked to the form.html file
for the style effective on the form.
Style.css file example;
.input-style
{
width:25%;
height:20px;
color:black;
font-size:15px;
}
.submit-style
{
width:10%;
height:45px;
color:white;
font-size:25px;
border-style:none;
background-color:skyblue;
}
Now that we have our
style.css file, it is time to link it with the form.html file. In between the
header open and closing tag (<head> </head>), write the single line
of code.
Style.css file linking example;
<head>
<link
rel=”stylesheet” href=”style.css”>
</head>
We’ve finally landed on the
php aspect. First is to create a table inside our database. The table is what
stores the information the users will send across.
Php mysqli table create script
example;
CREATE TABLE users_table(
ID int PRIMARY KEY,
Email varchar(250) NOT
NULL,
Number varchar (250) NOT
NULL
);
You need to keep record of
every information about the table we’ll make use of them when writing the php
script to trigger the action we want.
1. The table name is “users_table”.
2. Each user information has auto assigned ID.
3. Email column that not be empty.
4. Number column that will not be empty.
Now we know the key things
to work, it is time for the action script file and we’ll name it send.php.
Send.php file script
example;
<?php
//start
session
session_start();
//database
connection
$mydb
= new mysqli("localhost", "root", "",
example");
//Store
empty form data variables
$email
= $_POST['email'];
$number
= $_POST['number'];
/*
Select all in user
table
where the user
email
and password is
equal
to form variables */
$su
= $mydb->prepare("INSERT INTO users_table (email,number)
VALUES(?,?)");
$su->bind_param('ss',
$email, $number);
$su->execute();
?>
Related articles:
How to create web app chat system from scratch
How to master php valuables and data
How to know the difference between
programming and web development
We fetched the two values
from the HTML form and stored them inside a variable called $email and $number,
then we send to the table according to the columns in the table.
But before we start writing
the script, we first start a session, and then connect the script to the
database. We named our database “example” and username is root, localhost and
empty password because we’re running XAMPP in our system without taking it to
the internet.
The last thing now is to
assign the send.php to the HTML form using action attribute.
Linking send.php file to
HTML form example;
<form
action="send.php" method="POST"
class="signup-form-class">
Hope you now understand
everything about allowing users to send information into the database.
Happy learning!
Comments
Post a Comment