In this tutorial, we will show you how to make PHP Insert Data by using jQuery and Bootstrap 5 library. With this tutorial, we will learn you how can we connect PHP Database with Insert Data jQuery with Bootstrap 5 library. So under this tutorial, you can learn something new from this PHP tutorial.

Under this tutorial, we have use following web technology has been use, so you can get clear understanding regarding this tutorial.

  • PHP
  • Bootstrap

Following things we will cover under this tutorial.

  • STEP 1 HOW TO CREATE DATABASE TABLE
  • STEP 2 HOW TO CONNECT DATABASE USING PHP FUNCTION
  • STEP 3 HOW TO INSERT DATA USING PHP FUNCTION
  • STEP 4 HOW TO SHOW DATABASE DATA USING PHP FUNCTION

that’s it.

Step 1 How to Create Database Table

You can open your database then you can click here to new. Now you can use any table Name then you can use Name, Value and Auto Increment at last Click Here save button. Then Database Table Create done.

Database add

Step 2 How to Connect Database Using php function

Go to your Php page and use this code for database connection.

<?php $conn = new mysqli("localhost", "root", "", "datalist");  ?>

Step 3 How to Insert Data Using php function

At first You can create html Form using html, CSS and Bootstrap then you can use this function for Insert data in mySql database.

    <?php
    if (isset($_POST['submit'])) {
        $name = $_POST['name'];
        $email = $_POST['email'];
        $number = $_POST['number'];
        $birth = $_POST['birth'];

        $query = "INSERT INTO `personal`(`Name`, `Email`, `Mobile`, `Birth`) VALUES ('$name', '$email', '$number', '$birth')";
        if (mysqli_query($conn, $query)) {
            $success = "<div class='alert alert-success'><strong>Data Insert Success!</strong> </div>";
        } else {
            echo "fail";
        }
    }

    ?>

Now You can see your database, Data insert done 

mysql data listing

Step 4 How to Show database data using php function

at first you can create a table for show database data then you can use this code inside tbody

           <tbody>
                <?php
                $sql = "SELECT * FROM `personal`";
                $run = $conn->query($sql);
                while ($data = $run->fetch_array()) { ?>

                    <tr>
                        <td><?php echo $data['Name']; ?></td>
                        <td><?php echo $data['Email']; ?></td>
                        <td><?php echo $data['Mobile']; ?></td>
                        <td><?php echo $data['Birth']; ?></td>
                    </tr>
                <?php } ?>
            </tbody>

Now You can see everything is done.

Full HTML AND PHP code Here

<?php
$conn = new mysqli("localhost", "root", "", "datalist");
?>

<!DOCTYPE html>
<html lang="en">

<head>
    <title>How to Insert Data in Database using PHP MySQL</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
</head>

<body>

    <?php
    if (isset($_POST['submit'])) {
        $name = $_POST['name'];
        $email = $_POST['email'];
        $number = $_POST['number'];
        $birth = $_POST['birth'];

        $query = "INSERT INTO `personal`(`Name`, `Email`, `Mobile`, `Birth`) VALUES ('$name', '$email', '$number', '$birth')";
        if (mysqli_query($conn, $query)) {
            $success = "<div class='alert alert-success'><strong>Data Insert Success!</strong> </div>";
        } else {
            echo "fail";
        }
    }

    ?>

    <div class="container">

        <h2 class="text-center">How to Insert Data in Database using PHP MySQL</h2>


        <form action=" " method="post">
            <?php if (isset($success)) {
                echo $success;
            } ?>
            <div class="form-group">
                <label for="Name">Name:</label>
                <input type="text" name="name" class="form-control">
            </div>
            <div class="form-group">
                <label for="Email">Email:</label>
                <input type="email" name="email" class="form-control">
            </div>
            <div class="form-group">
                <label for="Mobile">Mobile No:</label>
                <input type="number" name="number" class="form-control">
            </div>
            <div class="form-group">
                <label for="Birth">Date Of Birth:</label>
                <input type="date" name="birth" class="form-control">
            </div>
            <button type="submit" name="submit" class="btn btn-success">Submit</button>
        </form>
        <br>
        <table class="table table-bordered">
            <thead>
                <tr class="info">
                    <th>Name</th>
                    <th>Email</th>
                    <th>Mobile No</th>
                    <th>Date Of Birth</th>
                </tr>
            </thead>
            <tbody>
                <?php
                $sql = "SELECT * FROM `personal`";
                $run = $conn->query($sql);
                while ($data = $run->fetch_array()) { ?>

                    <tr>
                        <td><?php echo $data['Name']; ?></td>
                        <td><?php echo $data['Email']; ?></td>
                        <td><?php echo $data['Mobile']; ?></td>
                        <td><?php echo $data['Birth']; ?></td>
                    </tr>
                <?php } ?>
            </tbody>
        </table>
    </div>

</body>

</html>

Need Any Help Watch This video