how to redraw datatables after filtering from the controller

vandyahmad24

I have datatables with the name VendorClinet, I want to filter the table, I send the filter using select, the problem here is the table doesn't want to change after filtering, I've tried using reload but the table still doesn't change

$('#status').on('change', function() {
         var status = $(this).val();
         $.ajax({
          type:"GET",
          url:"{{route('vendorInfo')}}"+"/"+"?status="+status,
          success:function(data){
               VendorClient.ajax.reload(null, false );
          }
         });
    });

and this my controller code

public function VendorInfo(Request $request)
    {
        $status = $request->input('status');
        $vendor  = DB::table('master.clientvend as cv')
                    ->leftJoin('master.fullvendor as fv','fv.id','=','cv.vendor_id')
                    ->select('cv.*','fv.name')
                    ->when($status, function ($query, $status) {
                        return $query->where('cv.status', $status);
                    })
                    ->get();   
}

var VendorClient = $("#tAdmin").DataTable({
     order: [ 0, "asc" ],
      processing: true,
      serverSide: false,
      ajax: "{{route('vendorInfo')}}",
      columns: [{
            data: null,
            render: function ( data, type, full, meta ) {
                return  meta.row+1;
            } },

        {
          data: "name",
          name: "name",
          orderable:false
        },
        {
          data: "status",
          name: "status",
          orderable:false
        },

        },
      ]
    }); 

kthorngren

The VendorClient.ajax.reload(null, false ); in the Ajax success function is going to use the original URL to load the data. If you look at the Developer Tools > Network you will probably see two Ajax requests; one for the url with the status parameter followed by the url with no parameters.

Instead of using ajax.reload try using clear() followed by rows.add(). Your success function will look something like this:

          success:function(data){
               data = JSON.parse(data);
               VendorClient.clear();
               VendorClient.rows.add( data ).draw();
          }

Kevin