1

I have this script in my admin.blade.php file.

<img src="#" id="editThumbnail">

I want to change the source with JQuery. Here is my script.

var photo = data.user.photo;
$("#editThumbnail").attr("src","{{asset('profile-photos/"+photo+"')}}")

For example, photo variable has value "marc.jpg". But, the photo won't appear. Here is the error from the browser. GET http://localhost:8000/profile-photos/$quot;+photo+&quot; (404 Not Found)

I have no idea how is this happen. Anyone can help me?

Penny Liu
  • 15,447
  • 5
  • 79
  • 98
Dani Fadli
  • 353
  • 4
  • 18
  • 3
    You have tried something of this: var path = "{{asset('profile-photos/')}}"; var photo = path + data.user.photo; $("#editThumbnail").attr("src",photo); – Magicianred Mar 19 '20 at 13:14
  • 2
    I haven't done it yet, but your answer is also clever and practical. It's just like do "concat" to the image source into one variable. Thanks a lot. – Dani Fadli Mar 19 '20 at 13:26
  • 1
    Just use `$("#editThumbnail").attr("src","{{ asset('profile-photos') }}/" + photo)` – Wahyu Kristianto Mar 19 '20 at 13:27
  • 1
    Is this answer your question - https://stackoverflow.com/questions/59933167/how-can-i-test-if-a-link-is-valid-in-javascript-or-jquery/59933245#59933245 – Alok Mali Mar 19 '20 at 13:35

2 Answers2

2

Try using template strings concept of JavaScript

$("#editThumbnail").attr("src","{`asset('profile-photos/${photo}')`}")

Try something like the above.

user2063635
  • 214
  • 1
  • 10
0

Try this -

$("#editThumbnail").attr("src","<?php echo asset('profile-photos/') ?>photo");
Alok Mali
  • 2,821
  • 2
  • 16
  • 32