PHP Laravel : Delete Data using Ajax

Question

I want to delete some data from database using ajax.. I've done the following steps to run..But while I was trying to delete it's shows following Error:

Failed to load resource: the server responded with a status of 404 (Not Found)

Here is my route:

Route::post('/delete/{id}',[
    'uses'=>'ItemController@delete',
    'as' => 'delete'
    ]);

Here is the controller:

public function delete($id)
        {
           Item::find($id)->delete();
            return Redirect::back();            
        }

And here is my view page:

<html>
    <head>
        <title> Item List</title>
        <meta name="csrf-token" content="{{ csrf_token() }}">
        <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha/css/bootstrap.css">
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    </head>

    <body>
            <div class="container">
                <h3> List Of Courses </h3></br>

                <table class="table table-striped table-bordered dataTable" id="example">
                <thead>
                <tr>
                    <td>Serial No</td>
                    <td>Title</td>
                    <td>Description</td>                    
                    <td>Action</td>
                </tr>
                </thead>
                <tbody>
                <?php $i=1; ?>
                @foreach($items as $row)

                    <tr>
                        <td>{{$i}}</td>
                        <td>{{$row->title }}</td>
                        <td>{{$row->description}}</td>                      
                        <td>    
                            <button type="button" onclick="deleteItem({{ $row->id }})" id="Reco" class="btn btn-danger">Delete</button>         
                        </td>
                    </tr>

                <?php $i++; ?>

                @endforeach
                </tbody>
            </table>
            </div>

            <script>
            function deleteItem(id) {
                $.ajaxSetup({
                        headers: {
                      'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    }
             });
          $.ajax({ 
                    type: "POST", 
                    url: '/delete/'+id,               

                    success: function(result) {
                          console.log(result);
                        }
                });          
            }
            </script>
    </body>
</html>

If anyone find the error I've done, hope you'll help me to find it out.

data might have already deleted?

Sanzeeb Aryal
– Sanzeeb Aryal

2016-08-30 05:38:55 +00:00
Commented Aug 30, 2016 at 5:38 — Sanzeeb Aryal
– Sanzeeb Aryal, Commented Aug 30, 2016 at 5:38
No... noting get deleted

Hola
– Hola

2016-08-30 05:42:43 +00:00
Commented Aug 30, 2016 at 5:42 — Hola
– Hola, Commented Aug 30, 2016 at 5:42

Sanzeeb Aryal · Accepted Answer · 2016-08-30 05:50:00Z

3

Generally passing parameter while deleting is not a good idea. since we can delete the data through url e.g /delete/4 while you may want to delete only after clicking the delete button.

 $.ajax({ 
           type: "POST", 
           url: "{{url('/delete)}}",               
           data:{id:id}
           success: function(result) {
           console.log(result);
           }
       });

route:

Route::post('/delete',[
    'uses'=>'ItemController@delete',
    'as' => 'delete'
    ]);

and, the controller

public function delete(Request $request)
{
   $id=$request->id;
   Item::where(['id'=>$id])->delete();
   return Redirect::back();            
}

answered Aug 30, 2016 at 5:50

Sanzeeb Aryal

3,2663 gold badges22 silver badges44 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Hola Over a year ago

In your case data get deleted but the problem is doesn't redirect to the page means after deleted data shown in page ..after reload it i can't see the data!

Sanzeeb Aryal Over a year ago

Redirect::back() might be redirecting to same page. you can redirect to the intended route: return redirect('/index')

Md Rashedul Hoque Bhuiyan · Accepted Answer · 2016-08-30 06:53:52Z

2

Try this code:

function deleteItem(id) {
$.ajaxSetup({
            headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
             }
            });
            $.ajax({ 
           type: "POST", 
           url:"{{url('delete')}}", 
           data:{id:id},
           success: function(result) {
           location.reload();
           }
       }); 
          }

answered Aug 30, 2016 at 6:53

Md Rashedul Hoque Bhuiyan

10.7k5 gold badges33 silver badges42 bronze badges

Comments

Rakesh Sojitra · Accepted Answer · 2016-08-30 06:16:51Z

1

try this code

function deleteItem(id) {
var _token = $("input[name='_token']").val();
 $.ajax({
    type: "POST",
    url: '/task/'+id,
    data: '_method=DELETE&_token=' + _token,
    success: function (result) {
        console.log(result);
    }
 });
}

answered Aug 30, 2016 at 6:16

Rakesh Sojitra

3,6682 gold badges19 silver badges35 bronze badges

Comments

Mayank Pandeyz · Accepted Answer · 2016-08-30 05:10:42Z

0

Try this:

$.ajax({ 
    type: "POST", 
    url: url('/delete'),   // The correct way to call ajax function in laravel
    data:{
        id: id
    },     
    success: function(result) {
          console.log(result);
        }
});

answered Aug 30, 2016 at 5:10

Mayank Pandeyz

26.3k4 gold badges43 silver badges61 bronze badges

1 Comment

Hola Over a year ago

I've tried But same error I'm getting ..Internal server Error

Sainesh Mamgain · Accepted Answer · 2016-08-30 06:10:43Z

0

You can set a method destroy in your controller which laravel automatically uses for deleting. It accepts id.

public function destroy($id){ Item::find($id)->delete(); echo 'Deleted Successfully.'; }

for ajax just send a method delete with your token.

jQuery.ajax({ url:'your-controller-route/id', type: 'post', data: {_method: 'delete', _token :token}, success:function(msg){ // do stuff } });

answered Aug 30, 2016 at 6:10

Sainesh Mamgain

7971 gold badge11 silver badges35 bronze badges

Collectives™ on Stack Overflow

PHP Laravel : Delete Data using Ajax

5 Answers 5

2 Comments

Comments

Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

2 Comments

Comments

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related