Implementing Smart Search with Laravel and Typeahead.js

im trying to implement a Smart Search with Laravel and Typeahead.js i tryed this code but sadly it didn't work for me and i spent the day trying to solve this problem with no result please help to get it solved

here is my java script code

<script type="text/javascript">
                jQuery(document).ready(function($) {
                  // Set the Options for "Bloodhound" suggestion engine
                  var engine = new Bloodhound({
                    remote: {
                      url: '/find?q=%QUERY%',
                      wildcard: '%QUERY%'
                    },
                    datumTokenizer: Bloodhound.tokenizers.whitespace('q'),
                    queryTokenizer: Bloodhound.tokenizers.whitespace
                  });

                  $(".search-input").typeahead({
                    hint: true,
                    highlight: true,
                    minLength: 1
                  }, {
                    source: engine.ttAdapter(),

                      // This will be appended to "tt-dataset-" to form the class name of the suggestion menu.
                      name: 'usersList',

                      // the key from the array we want to display (name,id,email,etc...)
                      templates: {
                        empty: [
                        '<div class="list-group search-results-dropdown"><div class="list-group-item">Nothing found.</div></div>'
                        ],
                        header: [
                        '<div class="list-group search-results-dropdown">'
                        ],
                        suggestion: function (data) {
                          return '<a href="' + data.profile.name + '" class="list-group-item">' + data.profile.name + '- @' + data.profile.name + '</a>'
                        }
                      }
                    });
                });
         </script>

here is my form / blade.php

 <form class="typeahead" role="search" >
                    <div class="form-group">
                      <input type="search" name="q" class="form-control search-input" placeholder="Search" autocomplete="off">
                    </div>
                  </form>

here is my model

<?php

namespace App;

use Nicolaslopezj\Searchable\SearchableTrait;
use Illuminate\Database\Eloquent\Model;
use App\suggModel;

class SearchModel extends Model
{
     use SearchableTrait;

      protected $searchable = [
         'columns' => [
            'users.name '=> 9, 
            'users.email'=> 10, 
            'users.Phone'=> 8,
            'users.type_user'=> 7,
            'users.region'=> 6,
            'users.city'=> 10,
            'users.AOS'=> 10,
                 ]
        ];

        public function profile()
        {
          return $this->hasOne(suggModel::class);
        }
}

here is my controller

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\suggModel;


class SearchController extends Controller
{
                public function find(Request $request)
                {
                        return suggModel::search($request->get('q'))->get();
                }
}

and here is my rout

Route::get('find', 'SearchController@find');

from Newest questions tagged laravel-5 - Stack Overflow http://ift.tt/2jwv2zj
via IFTTT