DataTable Odd Behavior when Deleting Data - php

Question

I'm adding and deleting row on datatable via ajax.. when I delete data on the datatable and call the additional_info_datatable.ajax.reload() it gives me errors.
here's the error:
Here's my code:
PHP
public function ajax_call_additional_info(){
$result = $this->main_m->get_all_where('additional_info', array('is_deleted' => 0));
$data = array();
if(!empty($result)){
foreach($result as $row){
array_push($data,
array(
'id' => $row['additional_info_id'],
'description' => $row['description'],
'action' => "<button type='button' data-url='".site_url(array('events','soft_delete_additional_info'))."' data-name='".$row['description']."' data-id='".$row['additional_info_id']."' class='btn btn-danger delete_additional_info'><i class='fa fa-fw fa-trash'></i></button>"
));
}
echo json_encode(array('data' => $data));
}else{
echo json_encode(array("draw" => 0, "recordsTotal" => 0, "recordsFiltered" => 0, "data" => array()));
}
}
public function soft_delete_additional_info(){
$id = $this->input->post('id');
$name = $this->input->post('name');
$check_if_exist = $this->main_m->get_where('additional_info', array('additional_info_id' => $id));
if(!empty($check_if_exist)){
$this->main_m->update_data('additional_info', array('is_deleted' => 1), 'additional_info_id', $id);
// $newdata = array(
// 'type' => 'success',
// 'message' => $name."'s successfully deleted!"
// );
// $this->session->set_userdata($newdata);
$message = array('type' => 'alert-success', 'message' => $name."'s successfully deleted!");
echo json_encode($message);
// echo site_url(array("events", "hotel_groupings", $check_if_exist['event_id']));
// echo 1;
}
}
JQUERY
INITIALIZE DATATABLE:
var additional_info = $("#additional_info_table");
var additional_info_datatable = additional_info.DataTable({
"ajax": additional_info.data('url'),
"columns": [
{ "data": "id" },
{ "data": "description" },
{ "data": "action" },
],
"autoWidth": false,
// scrollX: true,
keys: true,
// iDisplayLength: 10,
// "lengthMenu": [[10, 25, 50, 100, -1], [10, 25, 50, 100, "All"]],
// buttons: []
});
DELETE CODE
$(document).on('click', '.delete_additional_info', function(){
var $this = $(this);
var $url = $this.data('url');
var $id = $this.data('id');
var $name = $this.data('name');
var $csrf_token = $("#csrf_token").val();
bootbox.confirm({
title: "Delete Data",
message: "Do you want to delete <strong>"+$name+"</strong>? This process is irreversible.",
buttons: {
cancel: {
label: '<i class="fa fa-times"></i> Cancel'
},
confirm: {
label: '<i class="fa fa-check"></i> Confirm'
}
},
callback: function (result) {
// console.log('This was logged in the callback: ' + result);
if(result){
$.ajax({
url:$url,
type:'post',
data:{id : $id, name: $name, csrf_test_name : $csrf_token},
dataType:'json',
success:function(data){
// console.log(data);
$(".alert").css("display","block");
$(".alert").addClass(data['type']);
$("#additional_info_message").html(data['message']);
additional_info_datatable.ajax.reload();
}
});
}
}
});