How to delete row from table in CodeIgniter?

I am new in CodeIgniter. I am using CodeIgniter for my project. I have done inserting data in database and retrieving data from the database and now I'm trying to delete row from the table in the database but I'm unable to do it.

I have tried many other way to do it but still no luck. My code is given below.

controller:

<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class School extends CI_Controller 
{
function __construct()
     {
      parent::__construct();
      $this->load->database();
      $this->load->helper(array('url','language'));
      $this->load->model('Main_model');
     }
     public function index()
        {
            if($this->input->post('submit'))
            {
                $data=array(
                'name'=> $this->input->post('name'),
                'email'=> $this->input->post('email'),
                'phone'=> $this->input->post('phone'));
                $insert=$this->Main_model->std($data);
            }
            $this->data["fetch_user"]=$this->Main_model->fetch_user();
            $this->load->view('form',$this->data);
        }
    public function delete_data()
    {
        $id=$this->uri->segment(3);
        $this->Main_model->delete_data($id);
        redirect(base_url()."deleted");
    }
    public function deleted()
    {
        $this->index();
    }
}
?>

model:

<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class Main_model extends CI_Model
{
public function std($data)
{
    $insert=$this->db->insert('user',$data);
    return $this->db->insert_id();
}
function fetch_user()
{
    $this->db->select('*');
    $this->db->from('user');
    $query=$this->db->get();
    return $query->result();
}
function delete_data($id)
{
    $this->db->where("id",$id);
    $this->db->delete("user");
}
}
?>

view:

<!DOCTYPE html>
<html>
<head>
<title>Form</title>
<style>
    input[type=text],input[type=number],input[type=email]
    {

        height:30px;
        width:250px;
        outline:none;
    }
    input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button
    { 
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        margin: 0; 
    }
    td,th,h3
    {
            font-size:18px;
            font-family:arial;
    }
    input[type="submit"]
    {
        padding:10px 20px;
        border:none;
        border-top-left-radius: 25px;
        border-bottom-right-radius: 25px;
        background:#7e57c2;
        color:#ffffff;
        outline:none;
    }
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
</head>
<body>
<h3>School Student data</h3>
<form method="post">
<table cellspacing="5" cellpadding="5">
    <tr>
        <td>Name</td>
        <td><input type="text" name="name" required></td>
    </tr>
    <tr>
        <td>Phone No.</td>
        <td><input type="number" name="phone" required></td>
    </tr>
    <tr>
        <td>E-Mail</td>
        <td><input type="email" name="email" required></td>
    </tr>
    <tr>
        <td><input type="submit" name="submit" value="Insert"></td>
    </tr>
</table>

</form>

<br><br>
<table border="1" cellspacing="5" cellpadding="5" >
<tr>
    <th style="padding:10px 20px;">ID</th>
    <th style="padding:10px 20px;">Name</th>
    <th style="padding:10px 20px;">Email</th>
    <th style="padding:10px 20px;">Phone No.</th>
    <th style="padding:10px 20px;">Action</th>
</tr>
<?php
    if($fetch_user !=null)
    {
        foreach($fetch_user as $row)
        {
?>
            <tr>
                <td><?php echo $row->id;?></td>
                <td><?php echo $row->name;?></td>
                <td><?php echo $row->email;?></td>
                <td><?php echo $row->phone;?></td>
                <td><a href="#" class="delete_data" id="<?php echo $row->id;?>">Delete</a></td>
            </tr>
<?php
        }
    }
    else
    {
?>
            <tr>
                <td colspan="4">sorry no data found</td>
            </tr>
<?php
    }
?>
</table>
<script>
$(document).ready(function(){
$('.delete_data').click(function(){
var id=$(this).attr("id");
if(confirm("are you sure you want to delete this?"))
{
    window.location="<?php echo base_url(); ?>delete_data/"+id;
}
else
{
    return false;
}
});
});

</script>


</body>
</html>

Solution

Instead of using jQuery for this you could have directly set the anchor tag link :

<td><a href="<?php echo base_url('delete_data').'$row->id'; ?>"  id="<?php echo $row->id;?>">Delete</a></td>

This will directly send you to the function delete_data of the controller. (instead of using class and click events in jquery)

Plus return yourself from the model to the controller on success.

function delete_data($id)
{
    $this->db->where("id",$id);
    $this->db->delete("user");
    return;//onsuccess
}