www.webdeveloper.com
Results 1 to 8 of 8

Thread: Can't seem to display image from folder on server

  1. #1
    Join Date
    Apr 2014
    Posts
    42

    Can't seem to display image from folder on server

    So I'm trying to display images that users upload on the home page. However, while the other info (description, title, username, date variables) shows up fine, the image will not show up for some reason.

    Here is the code on my home/index.php page :

    Code:
    <!doctype html>
    <html>
    <head>
    
    <?php
    	
    	include('header.php');
    
    ?>
    
    <title>Splindr</title>
    <link type="text/css" rel="stylesheet" href="index.css">
    </head>
    <body>
    
    	<div id="contentWrapper">
    
    		<?php 
    
    		$conn = mysqli_connect("localhost","root","") or die ("No SQLI");
    				mysqli_select_db($conn, "sample") or die ("No DB");
    
    		$sqli = "SELECT * FROM `photos` WHERE `username` = 'ralston3'";
    
    		$result = mysqli_query($conn, $sqli) or die ("No query");
    
    		while($row = mysqli_fetch_assoc($result))	{
    			$username = $row['username'];
    			$title = $row['title'];
    			$description = $row['description'];
    			$image_name = $row['image_name'];
    			$image_id = $row['image_id'];
    			$date = $row['post_date'];
    		}
    
    		$image_id = $image_id;
    
    		echo "<div id='photo'><div id='image'><img src='$image_id'><div    id='info_header'>$title &nbsp by &nbsp $username &nbsp on &nbsp $date   </div><div id='imageInfo'>$description</div></div></div>";
    
    		?>
            
            </div>
    </body>
    </html>
    I'm trying to work this so that when users upload their picture, the picture gets displayed on the homepage. Like I said, all other info displays properly except the image.

  2. #2
    Join Date
    Jul 2013
    Location
    Voorheesville NY USA
    Posts
    868
    What IS the value of 'image_id'?

  3. #3
    Join Date
    Apr 2014
    Posts
    42
    @gineerjm I actually figured out the problem and corrected it with this :

    Code:
    </head>
    <body>
    
    	<div id="contentWrapper">
    
    		<?php 
    
    		$conn = mysqli_connect("localhost","root","") or die ("No SQLI");
    				mysqli_select_db($conn, "sample") or die ("No DB");
    
    		$sqli = "SELECT * FROM `photos` WHERE `username` = 'ralston3'";
    
    		$result = mysqli_query($conn, $sqli) or die ("No query");
    
    		while($row = mysqli_fetch_assoc($result))	{
    			$username = $row['username'];
    			$title = $row['title'];
    			$description = $row['description'];
    			$image_name = $row['image_name'];
    			$image_id = $row['image_id'];
    			$random_directory = $row['random_direc'];
    			$date = $row['post_date'];
    		}
    
    		$image_info = "http://localhost/splindr_2.0/photos/$random_directory/$image_id";
    
    		echo "<div id='photo'><div id='actual_image'><img src='$image_info'><div id='info_wrapper'><div id='info_header'>Title: $title &nbsp By: $username &nbsp Date: $date</div><div id='description'>$description</div></div></div></div>"
    		
    		?>
    
            
            </div>
    
    </body>
    </html>
    But when I upload a new post(image) as the same user, instead of producing both images on the home page, instead it exchanges the image, so only that 1 image shows. How can I get multiple images to display in the index.php(home) page, without them swapping each other out. My code is above. Thanks

  4. #4
    Join Date
    Jul 2013
    Location
    Voorheesville NY USA
    Posts
    868
    Your query brings in possible multiple records for the current username value. But your processing of the results only yields the last record retrieved. You need to imbed your html output into the while loop like this:
    PHP Code:
    echo "<body>";
    $image_info "http://localhost/splindr_2.0/photos/$random_directory/$image_id";
    $conn mysqli_connect("localhost","root","") or die ("No SQLI");
    mysqli_select_db($conn"sample") or die ("No DB");
    $sqli "SELECT * FROM `photos` WHERE `username` = 'ralston3'";
    $result mysqli_query($conn$sqli) or die ("No query");
    while(
    $row mysqli_fetch_assoc($result))    
    {
        
    $username $row['username'];
        
    $title $row['title'];
        
    $description $row['description'];
        
    $image_name $row['image_name'];
        
    $image_id $row['image_id'];
        
    $random_directory $row['random_direc'];
        
    $date $row['post_date'];
        echo 
    '<div id="contentWrapper">';
        echo 
    "<div id='photo'>";
        echo 
    "<div id='actual_image'>";
        echo 
    "<img src='$image_info'>";
        echo 
    "<div id='info_wrapper'>";
        echo 
    "<div id='info_header'>Title: $title &nbsp By: $username &nbsp Date: $date</div>";
        echo 
    "<div id='description'>$description</div>";
        echo 
    "</div></div></div></div>";
    }
    echo 
    "</body></html>"
    Not sure how many of those divs need to be inside the while loop but you can re-arrange as needed.

  5. #5
    Join Date
    Apr 2014
    Posts
    42
    Touched your suggestion up to fit and it works great. Now it displays them all but in order from oldest to newest (when going from top to bottom). I'm trying to get the reverse, newest to oldest (when going from top to bottom), any suggestions?

  6. #6
    Join Date
    Apr 2014
    Posts
    42
    scratch that, figured it out. Thanks for all the help btw

  7. #7
    Join Date
    Jul 2013
    Location
    Voorheesville NY USA
    Posts
    868
    Success!!

    HTH!

  8. #8
    Join Date
    Jan 2014
    Posts
    49
    HTML Markup
    The HTML markup is simple, it
    contains an ASP.Net FileUpload
    control, a Button to trigger the
    upload process and an ASP.Net
    GridView that will display the
    uploaded images once upload is
    completed.
    <asp:FileUpload ID="FileUpload1"
    runat="server" />
    <asp:Button ID="btnUpload"
    runat="server" Text="Upload"
    OnClick="Upload" />
    <hr />
    <asp:GridView ID="GridView1"
    runat="server"
    AutoGenerateColumns="false"
    ShowHeader="false">
    <Columns>
    <asp:BoundField DataField="Text" />
    <asp:ImageField
    DataImageUrlField="Value"
    ControlStyle-Height="100"
    ControlStyle-Width="100" />
    </Columns>
    </asp:GridView>
    Namespaces
    You will need to import the
    following namespaces
    C#
    using System.IO;
    using System.Collections.Generic;
    VB.Net
    Imports System.IO
    Imports System.Collections.Generic

    www.bit.ly/TGBportal

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles