Laravel 5 & Typeahead.js: only retrieving the first 5 rows of the table

I was able (kind of) to integrate typeahead.js into my laravel app. But no matter what I write (even queries that do not exist in the db), it always retrieves the first 5 rows of the table I'm targeting.

I got a bit confused with the url and wildcard in the js, I'm pretty sure I got something (if not many things) wrong.

Also, I would like to retrieve the subreddit's name (as it's doing now) but submit its ID to the database because that's how I'm referencing it.

This is PostsController.php

public function getSubreddits() {
   $subreddits = Subreddit::all();

   return Response::json($subreddits);
}

Routes I'm using

Route::get('data/subreddits', 'PostsController@getSubreddits');
Route::get('data/subreddits/{QUERY}', 'PostsController@getSubreddits');

And the javascript + form

<script type="text/javascript">
        $(document).ready(function() {
            var bestPictures = new Bloodhound({
                datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'),
                queryTokenizer: Bloodhound.tokenizers.whitespace,
                prefetch: 'http://localhost/reddit/public/data/subreddits',
                remote: {
                    url: 'http://localhost/reddit/public/data/subreddits/%QUERY',
                    wildcard: '%QUERY'
                }
            });

            $('#remote .typeahead').typeahead(null, {
                name: 'name',
                display: 'name',
                source: bestPictures
            });
        });
    </script>

<div id="remote">
      <input class="form-control typeahead" type="text" placeholder="Choose a Subreddit">
</div>

via Chebli Mohamed