How to delete Data in Php using Ajax

Hey Everyone today i am gone tell you How to Delete Data in Php using Ajax and without reloading a full page


We are Covering hole Crud operation in php using JQuery Ajax

  • How to Insert Data in php using Ajax
  • How to View Data in Php using Ajax
  • How to Delete Data in php using Ajax
  • How to Update Data in php using Ajax

What i Use in My JQuery-Ajax Crud Project with php

  • XAMPP Server
  • MySQL for Database
  • JQuery-Ajax CDN Link
  • Php Language
  • VS Code editor

Folder Structure…



Step 1) Create Database
Go to This link in Localhost and create database
  • DB Name: ajax_crud
  • Table name: student
    CREATE TABLE `student` (
    `id` int(11NOT NULL,
    `name` varchar(55NOT NULL,
    `email` varchar(55NOT NULL,
    `message` varchar(55NOT NULL




Step 2) Create File config.php 
  • it was my Connection file which can connect php to MySQL database to perform Query’s.



    /* Database credentials. Assuming you are running MySQL
    server with default setting (user ‘root’ with no password) */
    /* Attempt to connect to MySQL database */
    $link = mysqli_connect(DB_SERVER, DB_USERNAME, DB_PASSWORD, DB_NAME);
    // Check connection
    if($link === false){
        die(“ERROR: Could not connect. “ . mysqli_connect_error());



Step 3) Make Some Changes in Delete button 
  • In delete button i add a (  data-id ) to get id on click by using a jquery on read.php
    require ‘config.php’;
    $sql = SELECT * FROM student;
    $result = mysqli_query($link$sql);
    if ($result->num_rows > 0) {
        while($row = $result->fetch_assoc()) {
            <td> <button class=“btn btn-warning btn-sm” >Update</button> </td>
            <td> <button class=“btn btn-danger btn-sm”
                                 data-id=<?=$row[“id”];?> >Delete</button> </td>


    else {
        echo “0 results”;


Step 3) Create File Ajax_delete.php
  • it is my Ajax_view.php file in this file we are creating dynamic tables using php.
        require ‘config.php’;
        $sql = DELETE FROM `student` WHERE id = $id;
        if (mysqli_query($link$sql)) {
            echo “Deleted”;
        else {
            echo “data not Deleted !”;


Step 4) Create File Read.php
  • In this HTML file i add a jquery to get delete id on click of delete button. and after delete i can refresh page using fetch function.
  <!DOCTYPE html>
  <html lang=“en”>
      <meta charset=“UTF-8”>
      <meta http-equiv=“X-UA-Compatible” content=“IE=edge”>
      <meta name=“viewport” content=“width=device-width, initial-scale=1.0”>
      <!– Bootstrap 5–>
      <link href=“” rel=“stylesheet”>
        <!– Google Fonts –>
      <link rel=“preconnect” href=“” />
      <link rel=“preconnect” href=“” />
      <link href=“” rel=“stylesheet”/>
      <!– Jquery CDN –>
      <script src=“”></script>


        body {


  <div class=“container mt-5” style=width:40%>
    <h1 class=“text-center”>View data In Php using Ajax</h1>
    <table class=“table table-bordered text-center mt-4” >
      <thead >


      <tbody id=“table”>


  $(document).ready(function() {
  //Read function
  function fetch(){ $.ajax({
      url: “AJax_view.php”,
      type: “POST”,
      cache: false,
      success: function(data){
  //Delete function
    $(document).on(“click”“.btn”function() {
      var delete_id = $(this).data(“id”);
        url: “Ajax_delete.php”,
        type: “POST”,
        cache: false,
          id: delete_id
        success: function(data_delete){







Go to Browser open url: 

=> Snapshots
Create page


Read page






After Delete


I hope this Post help you….
if you get any errror comment or message me.. i will help you..