DataTables warning: table id=category_table - Invalid JSON response. datatable ajax laravel - ajax

Question

i am using delete method to destroy an item of the category table but when i reload the datatable function ajax it gives me an error DataTables warning: table id=category_table - Invalid JSON response. i don't know why it returns this error please help i want to refresh the table without refreshing the website
note:the delete method works fine
my table
<h1>all categories</h1>
<table class="table" id="category_table">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">name</th>
<th scope="col">edit</th>
<th scope="col">delete</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
my ajax code
<script>
$(document).ready(function(){
$('body').on('click','#delete',function(){
var id = $(this).val();
$('#deleteexampleModal').modal('show');
$("#deleteid").val(id);
});
});
$('#deleteform').submit(function(e){
e.preventDefault();
var id = $("#deleteid").val();
// console.log(id);
$.ajax({
url: 'categories/'+id,
type: "DELETE",
dataType: 'json',
success:function(response){
console.log(response);
$("#deleteexampleModal").modal('hide');
// window.location.reload();
$('#category_table').DataTable().ajax.reload();
}
});
});
and my modal when clicking the delete button
<!-- delete Modal -->
<div class="modal fade" id="deleteexampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Add new Product</h5>
<button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form method="POST" id="deleteform" name="form">
#csrf
#method('DELETE')
<div class="form-group">
are you sure you want to delte this item?
<input type="text" id="deleteid" name="deleteid">
</div>
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary">Save changes</button>
</form>
</div>
<div class="modal-footer">
</div>
</div>
</div>
my delete method
public function deleteCategory($id){
$category = Category::find($id)->delete();
return response()->json([
'status' => 200,
'message' => 'deleted succfully'
]);
}