I'm making an app, where I have a users table on the INDEX with a search box above, where you're able to perform ajax search. My problem is, that so far I could only do the ajax search on a separate page, because it's a GET request on the INDEX, as well as my original INDEX request, where the PHP shows all the entries. Therefore, if I direct my search onto the INDEX, the page reloads anyways because of the \App\User::all();
PHP function.
My goal is to have just a single page, where I have my users table with all the entries, but when I perform some search, only the relevant entries get displayed in the table.
My current routes:
Route::resource('index', 'UsersController');
Route::get('results', 'SearchesController@search');
My search function:
public function search(Request $request) {
$keyword = $request->get('keyword');
if($keyword !== ''){
$users = \App\User::where("username", "LIKE","%$keyword%")
->orWhere("firstname", "LIKE", "%$keyword%")
->orWhere("lastname", "LIKE", "%$keyword%")
->orWhere("email", "LIKE", "%$keyword%")
->orWhere("phone", "LIKE", "%$keyword%")->get();
return view('pages.results', array( 'users' => $users ));
} elseif(empty($users) || $keyword == "") {
return view('pages.results');
}
}
My current view (the same both on INDEX and RESULTS pages):
@if(isset($users) && !$users->isEmpty())
<tr>
<th class='text-center'>Username</th>
<th class='text-center'>Firstname</th>
<th class='text-center'>Lastname</th>
<th class='text-center'>Email</th>
<th class='text-center'>Phone</th>
<th class='text-center'></th>
</tr>
@foreach($users as $user)
<tr>
<td class='text-center'>{{$user->username}}</td>
<td class='text-center'>{{$user->firstname}}</td>
<td class='text-center'>{{$user->lastname}}</td>
<td class='text-center'>{{$user->email}}</td>
<td class='text-center'>{{$user->phone}}</td>
<td class='text-center'>{!! link_to_action('UsersController@edit', 'Edit', $user->id, ['class'=>'btn btn-warning', 'style'=>'margin-bottom:5px']); !!}
{!! Form::open(['action' => ['UsersController@destroy', $user->id], 'method' => 'DELETE']) !!}
{!! Form::submit('Delete', ['class'=>'btn btn-danger']) !!}
{!! Form::close() !!}</td>
</tr>
@endforeach
@else
<td class="text-center"><b>No results found, please try again.</b><br /><a href="{{ url('index') }}"><b>Display All</b></a></td>
@endif
My current JS:
$('.searchbar').keypress(function (e) {
if (e.which == 13) {
$.ajax({
dataType: "json",
url: '/results',
data: {keyword: $('.searchbar').value()},
success: function (result) {
console.log($user.name);
},
error: function(){
console.log("No results.");
}
});
}
});
Thanks in advance!