Hola
Hola

Reputation: 2233

PHP Laravel : Delete Data using Ajax

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.

Upvotes: 2

Views: 6013

Answers (5)

Md Rashedul Hoque Bhuiyan
Md Rashedul Hoque Bhuiyan

Reputation: 10631

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();
           }
       }); 
          } 

Upvotes: 2

Rakesh Sojitra
Rakesh Sojitra

Reputation: 3658

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);
    }
 });
}

Upvotes: 1

Sainesh Mamgain
Sainesh Mamgain

Reputation: 785

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 } });

Upvotes: 0

Sanzeeb Aryal
Sanzeeb Aryal

Reputation: 3266

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();            
}  

Upvotes: 3

Mayank Pandeyz
Mayank Pandeyz

Reputation: 26258

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);
        }
});

Upvotes: 0

Related Questions