Larave Javascript Image Swap Dropdown List

Right now i'm develop eCommerce Shopping Site using Laravel 5.0 , this is for my fyp , there is long way to go .. anyway .

And , i make product show page

This is my controller :

     public function getView($id)
{
    return view('store.show')->with('products', Product::find($id))->with('categories',Category::all())->with('db',Product::all())->with('options', Gambar::where('product_id','=',$id)->lists('name', 'img'));
}

As you can see, on the end of the line have code lists('name', 'img')

It will list out the column name and image values into a List

Everything were works perfectly accept , i need to make drop down list with image change on select .

Look on the code for my drop down list and imageswap :

    <div class="form-group">

     {!! Form::open(array('url' => 'foo/bar')) !!}
     {!! Form::label('Link Category') !!}<br />
     {!! Form::select('product_id',(['0' => 'Select an Option'] + $options),null,['class' => 'form-control', 'id' => 'dlist', 'onChange' => 'swapImage()']) !!}
     {!! Form::close() !!}

     <script type="text/javascript">
     function swapImage(){
     var image = document.getElementById("imageToSwap");
     var dropd = document.getElementById("dlist");
     image.src = dropd.value;
     };
     </script>
    </div>

And this code where the image will appear base on select (products->image were main image , not seed from dropdown list :

 <img id="imageToSwap" src="{{asset($products->image)}}"  />

The flow of List in controller works , but it give this in view source chrome :

<img id="imageToSwap" src="img/upload/20-3-291-image-1.jpg"  />

So the image not appear in page , it should appear like this :

<img id="imageToSwap" src="localhost:8000/img/upload/20-3-291-image-1.jpg"  />

The question is , how to return the "img" with laravel asset {{asset()}}, so the image can display perfectly?

Any feedback really appreciated .

Thank you

via Chebli Mohamed