PHP code to display MySQL data in an HTML table

By | August 19, 2017

A simple HTML form containing fields – Name, Address Line1, Address Line2, and E-mail. On submitting the form, the data is inserted into MySQL table using PHP code. We will iterate over the each record present in the table to display MySQL data in an HTML table.

 

<?xml version="1.0" encoding="ISO-8859-1"?>
<html xmlns="http://www.w3.org/1999/xhtml">
<body>
<h3> Program to collect the customer-information </h3>
<form action ="Display.php" method="get">
<table border="5">
<tr>
<td> Enter Name:</td>
<td> <input type="text" name="name"> </td>
</tr>
<tr>
<td> Enter Address Line1: </td>
<td> <input type="text" name="address1"></td>
</tr>
<tr>
<td> Enter Address line2: </td>
<td> <input type="text" name="address2"> </td>
</tr>
<tr>
<td> Enter Email-id: </td>
<td> <input type="text" name="email"> </td>
</tr>
<tr>
<td> </td> </tr>
<tr> </tr>
<tr>
<td> <input type="submit" value="Submit"></td>
<td> <input type="Reset" value="Reset"></td>
</tr>
</br>
<a href="<a href="https://krazytech.com/programs/simple-library-management-system-php-mysql" target="_blank" rel="noopener">Search.html</a>"> To search click here </a> </td>
</table>
</form>
</body>
</html>

 

The following image shows how the UserData.html looks on the browser:
HTML form to insert data in to MySQL table

 

Suggested Read:

 

<html>
<head><title> Display.php </title></head>
<body bgcolor="aabbcc">
<?php
$name1=$_REQUEST["name"];
$address1=$_REQUEST["address1"];
$address2=$_REQUEST["address2"];
$email=$_REQUEST["email"];
define('DB_SERVER', 'localhost:3306');
define('DB_USERNAME', 'root');
define('DB_PASSWORD', 'root123');
define('DB_DATABASE', 'customers'); //where customers is the database
$db = mysqli_connect(DB_SERVER,DB_USERNAME,DB_PASSWORD,DB_DATABASE);
$query= "insert into address values('$name1','$address1','$address2','$email'); //to insert input records into a table - address
$enter= mysqli_query($db,$query);
$query="select * from address"; // Fetch all the records from the table address
$result=mysqli_query($db,$query);
?>
<h3> Page to display the stored data </h3>
<table border="1">
<tr>
<th> NAME </th>
<th> ADDRESS Line1 </th>
<th> ADDRESS Line2 </th>
<th> EMAIL-id </th> </tr>
<?php while($array=mysqli_fetch_row($result)) ?>
<tr>
<td><?echo $array[0];?></td>
<td><?echo $array[1];?></td>
<td><?echo $array[2];?></td>
<td><?echo $array[3];?></td>
</tr>
<?php endwhile; ?>
<?php mysqli_free_result($result); ?>
<?php mysqli_close($db); ?>
</table>
</body>
</html>

 

The following image shows how the Display.php looks on the browser:

PHP code to display MySQL data in an HTML table

display MySQL data in an HTML table


How to execute this code?

  1. You need to copy files UserData.html and Display.php to a PHP server. You can use wampserver software which provides an integrated environment to run PHP files along with the MySQL database server.
  2. Next, open this HTML file in the browser via localhost URL. Usually http://localhost/UserData.html
  3. Enter user details and submit the data.
  4. You should be able to see the results displayed on the same browser via Display.php file.



Author: Ravi Bandakkanavar

A Techie, Blogger, Web Designer, Programmer by passion who aspires to learn new Technologies every day. It has been 6 years since I have been publishing articles and enjoying every bit of it. I want to share knowledge and build a great community with people like you.

Suggested articles for you:

Did it help? Comment here..