title: Live Search inside Laravel 5 using Ajax
body: <p>I'm transferring a project into Laravel 5. I have a live search feature inside the navbar that lists existing names in database as you type.  </p>
  
  <p>When I type in a letter, the url inside Ajax is called but it gives a 500 error inside network inspect.</p>
  
  <p>Anyone know a solution?</p>
  
  <p><strong>Search input:</strong> </p>
  
  <pre><code>&lt;form action="/search" class="search_form" method="get" autocomplete="off"&gt;
                  &lt;div class="form-field"&gt;
                      &lt;input type="text" name="s" class="search_keyword" id="search_keyword_id"
                             placeholder="Search the FTSE 100 &amp; 250" required/&gt;
                      &lt;button type="submit" class="search_button" onclick="submitdata()"&gt;Search&lt;/button&gt;
                      &lt;div id="result"&gt;
  
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/form&gt;
  </code></pre>
  
  <p><strong>JS script</strong></p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  $(function () {
      $(".search_keyword").keyup(function () {
          var search_keyword_value = $(this).val();
          var dataString = 'search_keyword=' + search_keyword_value;
          if (search_keyword_value != '') {
              $.ajax({
                  type: "POST",
                  url: "/searching",
                  data: dataString,
                  cache: false,
                  success: function (html) {
                      $("#result").html(html).show();
                  }
              });
          }
          return false;
      });
  
      $("#result").live("click", function (e) {
          var $clicked = $(e.target);
          if (e.target.nodeName == "STRONG")
              $clicked = $(e.target).parent().parent();
          else if (e.target.nodeName == "SPAN")
              $clicked = $(e.target).parent();
          var $name = $clicked.find('.name').html();
          var decoded = $("&lt;div/&gt;").html($name).text();
          $('#search_keyword_id').val(decoded);
      });
  
      $(document).live("click", function (e) {
          var $clicked = $(e.target);
          if (!$clicked.hasClass("search_keyword")) {
              $("#result").fadeOut();
          }
      });
  
      $('#search_keyword_id').click(function () {
          $("#result").fadeIn();
      });
  });
  </code></pre>
  
  <p></p>
  
  <p><strong>Routing:</strong></p>
  
  <pre><code>Route::post('/searching', 'SearchController@index');
  </code></pre>
  
  <p><strong>The index function inside search controller:</strong></p>
  
  <pre><code>class SearchController extends Controller
  {
  public function index()
  {
  
      $search_keyword = $_POST['search_keyword'];
  
      $first_query = DB::table('ftse100')-&gt;select('name', 'symbol')-&gt;
      where('symbol', 'like', '%' . $search_keyword . '%')-&gt;orWhere('name', 'like', '%' . $search_keyword . '%');
  
      $query = DB::table('ftse250')-&gt;select('name', 'symbol')-&gt;
      where('symbol', 'like', '%' . $search_keyword . '%')-&gt;orWhere('name', 'like', '%' . $search_keyword . '%')
          -&gt;union($first_query)-&gt;get();
  
  
      $bold_search_keyword = '&lt;strong&gt;' . $search_keyword . '&lt;/strong&gt;';
  
      if ($query) {
          foreach ($query as $rows) {
              echo '&lt;div class="show" align="left"&gt;&lt;span class="name"&gt;' . str_ireplace
                  ($search_keyword, $bold_search_keyword, $rows['name']) . '&lt;/span&gt;&lt;/div&gt;';
          }
      } else {
          echo '&lt;div class="show" align="left"&gt;No matching records.&lt;/div&gt;';
      }
  
  }
  </code></pre>