title: display image from file on server using mysql query
body: <p>I can't seem to get my image file to load. It keeps showing the broken file icon and a box where the image should be but no image from the file path I designated. My $row['pic'] should output "profile/test5.jpg" from my MYSQL database which together with the "<a href="http://localhost/system/" rel="nofollow noreferrer">http://localhost/system/</a>" should make it a valid source. When I inspect the HTML page it says source unknown. Please help I really need this to show dynamic images on my webpage. Thank you in advance for any help you can provide.    </p>
  
  <pre><code>&lt;?php
  $link=mysqli_connect("localhost","root","","system");
  
  if (mysqli_connect_errno())
  echo "Failed to connect to MySQL: " . mysqli_connect_error();
  
  $action=$_POST["action"];
  if($action=="showroom"){
  $query="SELECT * FROM id WHERE name='Tom Smith'";
  $show=mysqli_query($link,$query) or die ("Error");
  while($row=mysqli_fetch_array($show)){
  echo "&lt;li&gt;".$row['name']."&lt;/li&gt;";
  $location = 'http://localhost/system/' . $row['pic'];
  echo '&lt;img width="250" height="250" src= "' . $location .'"/&gt;';
  }
  }
  ?&gt;
  </code></pre>
  
  <p>In case it is relevant here is the other piece of AJAX I am using.</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;script
  src="http://code.jquery.com/jquery-3.3.1.js"
  integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60="
  crossorigin="anonymous"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
  $(document).ready(function(){
  function showRoom(){
  $.ajax({
  type:"POST",
  url:"process.php",
  data:{action:"showroom"},
  success:function(data){
  $("#content").html(data);
  }
  });
  }
  showRoom();
  });
  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div id="content"&gt;&lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>