1

I need a help regarding my source code on uploading and displaying the profile picture of my users on their profile. The upload went smooth, but the display is not. The display of the user's picture is only shown in picture icon and not the real picture. Like this:

enter image description here

the file where the picture is stored is here enter image description here

and here is my source code

edit-profile.php

<div class="author">
<a href="#">
<img class="avatar border-gray" src="../uploads/candidate/<?php echo $row['photo']; ?>" alt="..."/>
 <h4 class="title"><?php echo $_SESSION['name']; ?><br /> </h4>
 </a>
</div>

EDIT:

I'll provide the full source code for both userindex.php and edit-profile.php here so maybe any of you can point me where I do wrong.

userindex.php

        <div class="content">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-md-8">
                        <div class="card">
                            <div class="header">
                                <h4 class="title">Edit Profile</h4>
                            </div>
                            <div class="content">
                                <form action="update-profile.php" method="post" enctype="multipart/form-data">
                                   
        <?php
        //Sql to get logged in user details.
        $sql = "SELECT * FROM users WHERE id_user='$_SESSION[id_user]'";
        $result = $conn->query($sql);

        //If user exists then show his details.
        if($result->num_rows > 0) {
        while($row = $result->fetch_assoc()) {
        ?>
        <div class="row">
                                    <div class="col-md-6">
                                      <div class="form-group">
                                        <label for="user_name" type="text" id="user_name"> Full Name</label>
          <input name="user_name" class="form-control" type="text" maxlength="100" value="<?php echo $row['user_name'] ?>" required=""/> 
                                        </div>
                                        </div>
                                    </div>
         
        <!-- section 1--> 
        
        <div class="row">
         <div class="col-md-6">
                                    <div class="form-group">
                                    <label for="ic_no" type="text" id="ic_no" maxlength="12">NRIC</label>
         <input name="ic_no"type="text" class="form-control" value="<?php echo $row['ic_no'] ?>" readonly>
                                     </div>
                                     </div>
                                        
        <div class="col-md-6">
                                     <div class="form-group">
                                     <label for="nationality" type="text" id="nationality">Nationality</label>
                                     <input name="nationality" class="form-control" type="text" id="nationality" value="<?php echo $row['nationality'] ?>"/>
                                        </div>
                                       </div>
                                    </div>

         <!--first section -->
         
                                    <div class="row">
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="gender" type="text" id="gender">Gender</label>
                                                <input  name="gender" class="form-control" type="text" id="gender" value="<?php echo $row['gender'] ?>"/>
                                            </div>
                                        </div>
                                       
            <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="race" type="text" id="race">Race</label>
                                                <input type="text" class="form-control" name="race" id="race" value="<?php echo $row['race'] ?>"/>
                                            </div>
                                        </div>
                                    </div>

         <!-- second section -->
         
          <div class="row">
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="contactno" type="text" id="contact_no">Contact No</label>
                                                <input  name="contactno" class="form-control" type="text" id="contact_no" value="<?php echo $row['contactno'] ?>">
                                            </div>
                                        </div>
                                       
            <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="email" type="text" id="email">Email</label>
                                                <input type="text" class="form-control" type="text" id="email" value="<?php echo $row['email'] ?>" readonly>
                                            </div>
                                        </div>
                                    </div> 
         
         <!--other add -->
         
                                    <div class="row">
                                        <div class="col-md-12">
                                            <div class="form-group">
                                        <label for="address" type="text" id="address">Current Address</label>
          <textarea id="address" name="address" class="form-control" rows="5" placeholder="Address"><?php echo $row['address']; ?></textarea>
                                            </div>
                                        </div>
                                    </div>
         
         <!-- third section -->
         
         <div class="row">
                                    <div class="col-md-6">
                                      <div class="form-group">
                                        <label for="highest_qualification" type="text" id="highest_qualification">Highest Qualification</label>
          <input name="highest_qualification" class="form-control" type="text" maxlength="100" value="<?php echo $row['highest_qualification'] ?>"/>
                                        </div>
                                        </div>
                                    </div>
         
         <!--another section -->
         <div class="row">
                                    <div class="col-md-6">
                                      <div class="form-group">
                                        <label for="university" type="text" id="university">University</label>
          <input name="university" class="form-control" type="text" maxlength="100" value="<?php echo $row['university'] ?>"/>
                                        </div>
                                        </div>
                                    </div>
         
         <!--another section -->
         <div class="row">
                                    <div class="col-md-6">
                                      <div class="form-group">
                                        <label for="major" type="text" id="major">Major</label>
          <input name="major" class="form-control" type="text" maxlength="100" value="<?php echo $row['major'] ?>"/>
                                        </div>
                                        </div>
                                    </div>
        
         <!-- another section-->
                                    
         <div class="row">
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="current_position" type="text" id="current_position">Current Position</label>
                                                <input type="text" class="form-control" name="current_position" value="<?php echo $row['current_position'] ?>"/>
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="position_appled" type="text" id="position_applied">Position Applied</label>
                                                <input type="text" class="form-control" name="position_applied" value="<?php echo $row['position_applied'] ?>">
                                            </div>
                                        </div>
          </div>
          
          
          <!--another section -->
          
         <div class="row">
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="current_monthly_salary" type="text" id="current_monthly_salary">Current Monthly Salary</label>
                                                <input type="text" class="form-control" name="current_position" value="<?php echo $row['current_monthly_salary'] ?>">
                                            </div>
                                        </div>
                                        
          <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="expected_monthly_salary" type="text" id="expected_monthly_salary">Expected Monthly Salary</label>
                                                <input type="text" class="form-control" name="position_applied" value="<?php echo $row['expected_monthly_salary'] ?>">
                                            </div>
                                        </div>
          </div>
          
         <!--another section --> 
        <div class="row">
                                    <div class="col-md-6">
                                      <div class="form-group">
                                        <label for="prefered_working_location" type="text" id="prefered_working_location">Prefered Working Location</label>
          <input name="prefered_working_location" class="form-control" type="text" maxlength="100" value="<?php echo $row['prefered_working_location'] ?>" />
                                        </div>
                                        </div>
          
         <div class="col-md-6">
                                      <div class="form-group">
                                        <label for="avaibility" type="text" id="avaibility">Avaibility</label>
         <select name = "avaibility" class="form-control " type="text" id="avaibility" value="<?php echo $row['avaibility'] ?>">
          <option value="">-- select one --</option>
          <option value="Immediately">Immediately</option>
          <option value="One Month">One Month</option>
          <option value="Two Month">Two Month</option>
          <option value="Three Month">Three Month</option>     
         </select>
                                        </div>
                                        </div>
          </div>

         
         <div class="row">
         <div class="col-md-12">
         <div class="form-group">
         <label for="language" type="text" id="language">Language Proficiency</label><br />
                            
          &nbsp&nbsp&nbsp<p>Proficiency level 0-poor; 10-excellent</p>


         <table border="2" bordercolor="gray" align="center">

         <tr> 
          <td>
           <label for="malay" type="text" id="malay" placeholder="Malay" style="color:black; width:200px"><b>Malay</b></label><br />
          </td> 

          <td>
           <input name="malay" type="text" class="form-control" maxlength="100" style="width: 200px" value="<?php echo $row['malay'] ?>"/>

          </td> 
         </tr>  

         <tr> 
          <td>
           <label for="english" type="text" id="english" placeholder="English" style="color:black; width:200px"><b>English</b></label><br />
          </td> 

          <td>
           <input name="english" type="text" class="form-control" maxlength="100" style="width: 200px" value="<?php echo $row['english'] ?>"/>

          </td> 
         </tr>  

         <tr> 
          <td>
           <label for="mandarin" type="text" id="mandarin" placeholder="Mandarin" style="color:black; width:200px"><b>Mandarin</b></label><br />
          </td> 

          <td>
           <input name="mandarin" type="text" class="form-control" maxlength="100" style="width: 200px" value="<?php echo $row['mandarin'] ?>"/>

          </td> 
         </tr>

         <tr> 
          <td>
           <label for="other" type="text" id="other" placeholder="Other" style="color:black; width:200px"><b>Others</b></label><br />
          </td> 

          <td>
           <input name="other" type="text" class="form-control" maxlength="100" style="width: 200px" value="<?php echo $row['other'] ?>"/>

          </td> 
         </tr>  

         </table>
         
         </div>
         </div>
         </div>
          
          

                                    <div class="row">
                                        <div class="col-md-12">
                                            <div class="form-group">
                                       
                                            <label for="aboutme" type="text" id="aboutme"><b>About Me</b></label><br />
           <p>Summarize your employement history (Not more than 100 words)</p>
           <textarea class="form-control" rows="6" id="aboutme" name="aboutme" maxlength="400" style="width: 560px"value="<?php echo $row['aboutme'] ?>"></textarea>
                                            </div>
                                        </div>
                                    </div>
         
         
         <div class="row">
                                    <div class="col-md-6">
                                      <div class="form-group">
                                        <label style="color:black;">Latest passport photo</label>
          <input class="btn btn-danger" type="file" name="image" id="profile-img" /><br>
          <img src="../uploads/candidate/<?php echo $row['photo']; ?>" id="profile-img-tag" width="200px" />
                                        </div>
                                        </div>
          
         <div class="col-md-6">
                                      <div class="form-group">
                                        <label style="color:black;">File format PDF and doc only!</label>
          <input type="file" name="resume" class="btn btn-danger" />
                                        </div>
                                        </div>
         </div>
        
                                    <button type="submit" class="btn btn-info btn-fill pull-right">Update Profile</button>
                                    <div class="clearfix"></div>
         
          <?php
        
        }
       }
       ?>
                                </form>
       
   <?php if(isset($_SESSION['uploadError'])) { ?>
            <div class="row">
              <div class="col-md-12 text-center">
                <?php echo $_SESSION['uploadError']; ?>
              </div>
            </div>
            <?php } ?>
                            </div>
                        </div>
                    </div>
     
     <!--second part of picture and resume -->
                    <div class="col-md-4">
                        <div class="card card-user">
                           
          <div class="image">
                                <img src="https://ununsplash.imgix.net/photo-1431578500526-4d9613015464?fit=crop&fm=jpg&h=300&q=75&w=400" alt="..."/>
                            </div>
                            
       <div class="content">
                                <div class="author">
                                     <a href="#">
          
           <img class="avatar border-gray" src="../uploads/candidate/<?php echo $row['photo']; ?>" alt="..."/>           
                                      <h4 class="title"><?php echo $_SESSION['name']; ?><br /> </h4>
                                    </a>
    </div>
    </div>
                            <hr>
                            <div class="text-center">
                                <button href="#" class="btn btn-simple"><i class="fa fa-facebook-square"></i></button>
                                <button href="#" class="btn btn-simple"><i class="fa fa-twitter"></i></button>
                                <button href="#" class="btn btn-simple"><i class="fa fa-google-plus-square"></i></button>

                            </div>
                        </div>
                    </div>

                </div>
            </div>

and this is update-profile.php

<?php

//To Handle Session Variables on This Page
session_start();

if(empty($_SESSION['id_user'])) {
  header("Location: ../index.php");
  exit();
}

//Including Database Connection From db.php file to avoid rewriting in all files
require_once("../db.php");

//if user Actually clicked update profile button
if(isset($_POST)) {

  //Escape Special Characters
 if(isset($_POST)) {
 $user_name = mysqli_real_escape_string($conn, $_POST['user_name']);
 $ic_no = mysqli_real_escape_string($conn, $_POST['ic_no']);
 $nationality = mysqli_real_escape_string($conn, $_POST['nationality']);
 $gender = mysqli_real_escape_string($conn, $_POST['gender']);
 $race = mysqli_real_escape_string($conn, $_POST['race']);
 $ic_no = mysqli_real_escape_string($conn, $_POST['ic_no']);
 $contactno = mysqli_real_escape_string($conn, $_POST['contactno']);
 $email = mysqli_real_escape_string($conn, $_POST['email']);
 $address = mysqli_real_escape_string($conn, $_POST['address']);
 $highest_qualification = mysqli_real_escape_string($conn, $_POST['highest_qualification']);
 $university = mysqli_real_escape_string($conn, $_POST['university']);
 $major = mysqli_real_escape_string($conn, $_POST['major']);
 $current_position = mysqli_real_escape_string($conn, $_POST['current_position']);
 $position_applied = mysqli_real_escape_string($conn, $_POST['position_applied']);
 $current_monthly_salary = mysqli_real_escape_string($conn, $_POST['current_monthly_salary']);
 $expected_monthly_salary = mysqli_real_escape_string($conn, $_POST['expected_monthly_salary']);
 $prefered_working_location = mysqli_real_escape_string($conn, $_POST['prefered_working_location']);
 $avaibility = mysqli_real_escape_string($conn, $_POST['avaibility']);
 $malay = mysqli_real_escape_string($conn, $_POST['malay']);
 $english = mysqli_real_escape_string($conn, $_POST['english']); 
 $mandarin = mysqli_real_escape_string($conn, $_POST['mandarin']);
 $other = mysqli_real_escape_string($conn, $_POST['other']);
 $aboutme = mysqli_real_escape_string($conn, $_POST['aboutme']);

 $uploadOk = true;

 if(isset($_FILES)) {

  $folder_dir = "../uploads/resume/";

  $base = basename($_FILES['resume']['name']); 

  $resumeFileType = pathinfo($base, PATHINFO_EXTENSION); 

  $file = uniqid() . "." . $resumeFileType;   

  $filename = $folder_dir .$file;  

  if(file_exists($_FILES['resume']['tmp_name'])) { 
   
   if($resumeFileType == "pdf")  {

    if($_FILES['resume']['size'] < 500000) { // File size is less than 5MB

     move_uploaded_file($_FILES["resume"]["tmp_name"], $filename);

    } else {
     $_SESSION['uploadError'] = "Wrong Size. Max Size Allowed : 5MB";
     header("Location: edit-profile.php");
     exit();
    }
   } else {
    $_SESSION['uploadError'] = "Wrong Format. Only PDF Allowed";
    header("Location: edit-profile.php");
    exit();
   }
  }
 } else {
  $uploadOk = false;
 }

 

 //Update User Details Query

$sql= "UPDATE users set user_name='$user_name', ic_no='$ic_no', gender='$gender', nationality='$nationality', race='$race', email='$email', contactno='$contactno', highest_qualification='$$highest_qualification',
 university='$university', major='$major', current_position='$current_position', position_applied='$position_applied', current_monthly_salary='$current_monthly_salary', 
 expected_monthly_salary='$expected_monthly_salary', prefered_working_location='$prefered_working_location', avaibility='$avaibility', malay='$malay', english='$english',
 mandarin='$mandarin', other='$other', photo='$file', resume='$file', aboutme='$aboutme'";

 if($uploadOk == true) {
  $sql .= ", resume='$file'";
 }

 $sql .= " WHERE id_user='$_SESSION[id_user]'";

 if($conn->query($sql) === TRUE) {
  $_SESSION['user_name'] = $user_name;
  //If data Updated successfully then redirect to dashboard
  header("Location: index.php");
  exit();
 } else {
  echo "Error ". $sql . "<br>" . $conn->error;
 }
 //Close database connection. Not compulsory but good practice.
 $conn->close();

} else {
 //redirect them back to dashboard page if they didn't click update button
 header("Location: edit-profile.php");
 exit();

 
}};
WanHazyan
  • 257
  • 1
  • 12

5 Answers5

2

Check your update-profile.php

There's confusion happened there because you put the same 'file name' for both your file type for image and resume. You should do it like this instead

<?php

//To Handle Session Variables on This Page
session_start();

if(empty($_SESSION['id_user'])) {
  header("Location: ../index.php");
  exit();
}

//Including Database Connection From db.php file to avoid rewriting in all files
require_once("../db.php");

//if user Actually clicked update profile button
if(isset($_POST)) {

  //Escape Special Characters
 if(isset($_POST)) {
 $user_name = mysqli_real_escape_string($conn, $_POST['user_name']);
 $ic_no = mysqli_real_escape_string($conn, $_POST['ic_no']);
 $nationality = mysqli_real_escape_string($conn, $_POST['nationality']);
 $gender = mysqli_real_escape_string($conn, $_POST['gender']);
 $race = mysqli_real_escape_string($conn, $_POST['race']);
 $ic_no = mysqli_real_escape_string($conn, $_POST['ic_no']);
 $contactno = mysqli_real_escape_string($conn, $_POST['contactno']);
 $email = mysqli_real_escape_string($conn, $_POST['email']);
 $address = mysqli_real_escape_string($conn, $_POST['address']);
 $highest_qualification = mysqli_real_escape_string($conn, $_POST['highest_qualification']);
 $university = mysqli_real_escape_string($conn, $_POST['university']);
 $major = mysqli_real_escape_string($conn, $_POST['major']);
 $current_position = mysqli_real_escape_string($conn, $_POST['current_position']);
 $position_applied = mysqli_real_escape_string($conn, $_POST['position_applied']);
 $current_monthly_salary = mysqli_real_escape_string($conn, $_POST['current_monthly_salary']);
 $expected_monthly_salary = mysqli_real_escape_string($conn, $_POST['expected_monthly_salary']);
 $prefered_working_location = mysqli_real_escape_string($conn, $_POST['prefered_working_location']);
 $avaibility = mysqli_real_escape_string($conn, $_POST['avaibility']);
 $malay = mysqli_real_escape_string($conn, $_POST['malay']);
 $english = mysqli_real_escape_string($conn, $_POST['english']); 
 $mandarin = mysqli_real_escape_string($conn, $_POST['mandarin']);
 $other = mysqli_real_escape_string($conn, $_POST['other']);
 $aboutme = mysqli_real_escape_string($conn, $_POST['aboutme']);

 $uploadOk = true;

 if(isset($_FILES)) {

  $folder_dir = "../uploads/resume/";

  $base = basename($_FILES['resume']['name']); 

  $resumeFileType = pathinfo($base, PATHINFO_EXTENSION); 
//notice that I changed your file name from $file to $file1
  $file1 = uniqid() . "." . $resumeFileType;   

  $filename = $folder_dir .$file1;  

  if(file_exists($_FILES['resume']['tmp_name'])) { 
   
   if($resumeFileType == "pdf")  {

    if($_FILES['resume']['size'] < 500000) { // File size is less than 5MB

     move_uploaded_file($_FILES["resume"]["tmp_name"], $filename);

    } else {
     $_SESSION['uploadError'] = "Wrong Size. Max Size Allowed : 5MB";
     header("Location: edit-profile.php");
     exit();
    }
   } else {
    $_SESSION['uploadError'] = "Wrong Format. Only PDF Allowed";
    header("Location: edit-profile.php");
    exit();
   }
  }
 } else {
  $uploadOk = false;
 }


//image update edit 
 if(is_uploaded_file ( $_FILES['image']['tmp_name'] )) {

  $folder_dir = "../uploads/logo/";

  $base = basename($_FILES['image']['name']); 

  $imageFileType = pathinfo($base, PATHINFO_EXTENSION); 

  $file = uniqid() . "." . $imageFileType; 
   
  $filename = $folder_dir .$file;  

  if(file_exists($_FILES['image']['tmp_name'])) { 

   if($imageFileType == "jpg" || $imageFileType == "png")  {

    if($_FILES['image']['size'] < 500000) { // File size is less than 5MB

     //If all above condition are met then copy file from server temp location to uploads folder.
     move_uploaded_file($_FILES["image"]["tmp_name"], $filename);

    } else {
     $_SESSION['uploadError'] = "Wrong Size. Max Size Allowed : 5MB";
     header("Location: edit-profile.php");
     exit();
    }
   } else {
    $_SESSION['uploadError'] = "Wrong Format. Only jpg & png Allowed";
    header("Location: edit-profile.php");
    exit();
   }
  }
 } else {
  $uploadOk = false;
 }

 //Update User Details Query

$sql= "UPDATE users set user_name='$user_name', ic_no='$ic_no', gender='$gender', nationality='$nationality', race='$race', email='$email', contactno='$contactno', highest_qualification='$$highest_qualification',
 university='$university', major='$major', current_position='$current_position', position_applied='$position_applied', current_monthly_salary='$current_monthly_salary', 
 expected_monthly_salary='$expected_monthly_salary', prefered_working_location='$prefered_working_location', avaibility='$avaibility', malay='$malay', english='$english',
 mandarin='$mandarin', other='$other', logo='$file', resume='$file1', aboutme='$aboutme'";

 if($uploadOk == true) {
  $sql .= ", resume='$file'";
 }

 $sql .= " WHERE id_user='$_SESSION[id_user]'";

 if($conn->query($sql) === TRUE) {
  $_SESSION['user_name'] = $user_name;
  //If data Updated successfully then redirect to dashboard
  header("Location: edit-profile.php");
  exit();
 } else {
  echo "Error ". $sql . "<br>" . $conn->error;
 }
 //Close database connection. Not compulsory but good practice.
 $conn->close();

} else {
 //redirect them back to dashboard page if they didn't click update button
 header("Location: edit-profile.php");
 exit();

 
}};

I have tried your previous code, that cause the image to be stored as pdf and that's why when you call for the image to be displayed, it's appears as broken image icon instead. I hope this can help you well and good luck!

WanHazian
  • 66
  • 9
0

Try this code

<img src="uploads/candidate/.'<?php echo row['photo']; ?>'"/>

  • You do not need the `.` nor the single quotes `'` for your suggestion. You are not concatenating onto anything. If anything, it will mess up the path even more, because it will be something like `uploads/candidate/.'photo-path'`, which doesn't seem valid. – Martin Sep 25 '18 at 07:04
0

You need to make sure the $row value actually got value. try this and see if you got any result:

 die(var_dump("../uploads/candidate/".$row['photo'] ));

You will get the path the code is refering to, if that doesn't give a result check your query again ( check if the row got value )

E3Im
  • 330
  • 2
  • 17
0

You can do this introducing an external php file e.g get.php, then request the photo from this get.php. See sample of both files below.

display.php file

<?php
$id = row['id'];

<img class="avatar" src=get.php?id=$id alt="profile photo" />
 ?>

get.php file

<?php
 // make connections with database here
$id = $_REQUEST['id'];

$image = ("SELECT * FROM table WHERE id = '$id'");
$image = $image->fetch_assoc();
$image = $image['photo'];

 echo $image;
 ?>
0

You have problem in your $_SESSION array userindex.php file. You have missed the quites ' for session key

$sql = "SELECT * FROM users WHERE id_user='$_SESSION[id_user]'";

So assign it to a variable first and then put that variable inside sql query

$id_user = $_SESSION['id_user'];// single quotes for session key
$sql = "SELECT * FROM users WHERE id_user='$id_user'";

Note: Your code is open to sql injections. Try use PDO or prepared statements

Zain Farooq
  • 2,956
  • 3
  • 20
  • 42