Pass laravel query result to blade via ajax - ajax

Question

I'm wondering how I can pass a laravel query result back to my ajax function on success. I've read something about json encode but I'm getting kind of confused as how I can do so, not really familiar with json that much.
Ajax
$('#userFilter').change(function(){
var selected = $('#userFilter').find(':selected').val();
var token = $('#token').val();
$.ajax({
type: 'POST',
url: '/admin_panel',
data: {
_token : token,
selected : selected,
},
success: function(data){
$('#usersViewBody').html(data);
}
})
});
Controller
function filterUsers(Request $request) {
$selected = $request->selected;
if ($selected == 0) {
$users = DB::table('users')->paginate(15);
} elseif ($selected == 1){
$users = DB::table('users')
->where('status', '=', '0')
->orWhere('status', '=', '1')
->paginate(15);
} else {
$users = DB::table('users')
->where('status', '=', '2')
->orWhere('status', '=', '3')
->paginate(15);
}
return $users;
View
<tbody id="usersViewBody">
#foreach($users as $user)
<tr>
<td><a data-uid="{{$user->id}}" class="openUserPanel" href="#tabUserInfo"> {{$user->name}}</a></td>
<td>{{$user->department}}</td>
<td>{{$user->position}}</td>
#if($user->status == 0)
<td class="userActive">Active</td>
#elseif($user->status == 1)
<td class="userOOO">On Leave</td>
#elseif($user->status == 2)
<td class="userInactive">Retired</td>
#else
<td class="userInactive">Terminated</td>
#endif
#if($user->status == 2 || $user->status == 3)
<td><button class="btn btn-xs btn-default payrollModalTrigger disabled" data-uid="{{$user->id}}">Update Payroll</button></td>
#else
<td><button class="btn btn-xs btn-default payrollModalTrigger" data-uid="{{$user->id}}">Update Payroll</button></td>
#endif
</tr>
#endforeach
</tbody>
</table>
</div>
<div class="text-center">
{{ $users->links() }}
</div>

Answer 1

Instead of returning collection $users from your controller you need to return view back to the ajax, hence change the return of the controller method from
return $users;
to
return view('name of the view', compact('users'));

Answer 2

Blade is used when the page is first loaded (i.e. it's rendered on the server), it will only run again if you reload the page which is in contrast to what you're trying to do with ajax, i.e. interact with the server without a page reload.
What you want to do in your ajax success call is constrcut HTML for the contents of your table body in javascript along with the data you get in the response from the server.
This package has already done all the heavy lifting for you https://github.com/yajra/laravel-datatables, it would, of course, be good to learn how to do it yourself though!