Issue with Laravel auto complete search

When I type something inside my search field ,the page refresh itself , but stays the same, in exception of the query string that gathered to my dynamic url .The suggestions inside my autocomplete search field not working either. Basically I placed my search field inside 2 pages, one is products.blade.php the other one is categories.blade.php .Each one of this pages has a dynamic url .

**Sorry in advance for a long post.

The routes for those pages are:

Route::get('shop', 'ShopController@categories'); -my main shop page the shows all the categories. 

Route::get('shop/{category_url}', 'ShopController@products');   -  the page that shows products page related to category.  

Route::get('shop/{category_url}/{product_url}', 'ShopController@item'); - the route to the page that shows a single product page with all the info and larger image.

I have models for both categories and products.There is relationship between the two.

Categorie.php :

public function products(){

        return $this->hasMany('App\Product');
    } 

Product.php:

public function category() { return $this->belongsTo('App\Categorie'); }

Route for AutoCompleteSearch:

Route::get('products/{id}', 'AutoCompleteController@show'); 
    Route::get('autocomplete',array('as'=>'autocomplete','uses'=>'AutoCompleteController@show'));
    Route::get('searchajax',array('as'=>'searchajax','uses'=>'AutoCompleteController@autoComplete'));  

AutoCompleteController:

<?php

namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Http\Controllers\Controller;
use App\Product;
class AutoCompleteController extends MainController {

     public function show(Product $product) {
        return view('content.products', ['product' => $product]);

   }
    public function autoComplete(Request $request) {
        $query = $request->get('term','');

        $products=Product::where('title','LIKE','%'.$query.'%')->get();

        $data=array();
          dd($products);
        foreach ($products as $product) { 

                   $category_url = $product->category->url;  
                   $data[]=array('label'=>$product->title,'value'=>$category_url);
        }
        if(count($data)){
        return $data;}
        else{
            return ['value'=>'No Result Found','title'=>'']; 


    }}

} 

My Categories.blade.php:

@extends ('master') 

@section('content')   
<link href="http://ift.tt/2w0icRg" rel="stylesheet">
  <script src="http://ift.tt/2n9t8Vj"></script>
<script src="http://ift.tt/2rGRyYw"></script>
<div class="row">  
    <form class="navbar-form text-center " form method="GET" action=" ">
        <input id="search_text" placeholder=" Search products" name="search_text" type="text" value="" style="width: 400px; height: 35px; border-radius: 5px ; padding-left: 12px;"><br><br>
        <input class="btn btn-default " type="submit" value="  Search" >  
    </form>
</div>
<script> 
      $(document).ready(function () {
       src = "";
       $("#search_text").autocomplete({ 

    source: function (request, response) {
        $.ajax({
            url: src,
            dataType: "json",
            data: {
                term: request.term
            },
            success: function (data) {
                response(data);

            }
        });
    },
    minLength: 3,
    select: function( event, ui ) {
        // Your autoComplete response returns the ID in the 'id' field
        window.location = '+ ui.item.value';
    }
});  
      });
</script>
       <div class="row"> 
    <div class="col-md-12"> 

        <h1 class="text-center">Myhero Shop</h1> <br><br>
    </div>   

</div>  
<div class="row"> 

    @if ($categories) 
    @foreach($categories as $category) 
    <div class="col-md-6 col-sm-6 text-center"> 
        <h3 > </h3>    
        <p><a href="" class="grayscaleimg"><img width="250" src=""></a></p>  
        <p>{!! $category['article']!!}</p>  


    </div> 
    @endforeach 
    @else 
    <div class="col-md-12"> <br><br>
        <p class="text-center" style="font-size: 18px"><b>No categories found...</b></p>
        <div 
            @endif
    </div>
    @endsection 

My products.blade.php :

@extends ('master') 

@section('content')   
<link href="http://ift.tt/2w0icRg" rel="stylesheet">
  <script src="http://ift.tt/2n9t8Vj"></script>
<script src="http://ift.tt/2rGRyYw"></script>

<div class="row">  
    <form class="navbar-form text-center " form method="GET" action=" ">
        <input id="search_text" placeholder=" Search products" name="search_text" type="text" value="" style="width: 400px; height: 35px; border-radius: 5px ; padding-left: 12px;"><br><br>
        <input class="btn btn-default " type="submit" value="  Search" >  

    </form>  

</div>


<script> 
      $(document).ready(function () {
      src = "";
      $("#search_text").autocomplete({ 

    source: function (request, response) {
        $.ajax({
            url: src,
            dataType: "json",
            data: {
                term: request.term
            },
            success: function (data) {
                response(data);

            }
        });
    },
    minLength: 3,
    select: function( event, ui ) {

        window.location = '+ ui.item.value';

    }
});  
      });  


</script>

<div class="row"> 
    <div class="col-md-12">
        <h1 class="text-center">  
            @if(!empty($page_title)) 
             
            @else 
            <p class="text-center" style="font-size: 18px">No products for this category...</p>
            @endif
        </h1> 
    </div> 
</div> 
<div class="row"> 
    @if($products)   

    <br><br>  

    <p class="text-center"><a href="  " style="color:black"> High to low</a> |
        <a href="  " style="color:black">Low to high</a>| 
        <a href="  " style="color:black">New items</a></p>

    <br>
    @foreach($products as $product) 
    <div class="col-md-6 col-sm-6 text-center"> 
        <h3></h3> 
        <p><a href="" class="grayscaleimg"><img width="200" src ="" ></a></p> 
        <p>{!! $product['article'] !!}</p>
        <p><b>Price on our site:</b>$</p> 
        <p>  
            @if(Cart::get($product['id'])) 
            <input disabled="disabled" type="button" value="In Cart!" class="btn btn-success ">  
            @else  
            <input data-id="" type="button" value="+ Add to cart" class="btn btn-success add-to-cart">  
            @endif    
        </p> 
    </div> 
    @endforeach
    @elseif(!empty($page_title)) 
    <div class="col-md-12"> 
        <p class="text-center" style="font-size: 18px">No products for this category...</p> 
    </div> 
    @endif 
</div> 

@endsection

via Chebli Mohamed