sklrboy sklrboy - 1 year ago 67
Ajax Question

Laravel 5 how to compose GET route to INDEX if my search query is also a GET to the INDEX?

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

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())
<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>
@foreach($users as $user)
<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>
<td class="text-center"><b>No results found, please try again.</b><br /><a href="{{ url('index') }}"><b>Display All</b></a></td>

My current JS:

$('.searchbar').keypress(function (e) {
if (e.which == 13) {

dataType: "json",
url: '/results',
data: {keyword: $('.searchbar').value()},
success: function (result) {
error: function(){
console.log("No results.");


Thanks in advance!

Answer Source

I don't see any reason to use ajax if all you want to do is filter results on your index page. This can be done with javascript (example)

As for your code: you are returning whole view in your controller instead of data that you could use in your javascript. You should check out this. After that just replace your data in html with data returned from ajax.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download