I am making a user profile having the functionality of changing profile pictures and adding/editing bio. I am taking the user input file (pic) and saving it on the database. However, a database update is successful but I am unable to retrieve the image. Same with the bio, the update is successful even it is changing and updating on site but on page load it is gone.
this code is fetching data shown on profile
<?php
$con = mysqli_connect('localhost','root','','juwsp') ;
$result = mysqli_query($con,"SELECT * FROM signup WHERE StudentId='" . $_SESSION["StudentId"] . "' and Password = '". $_SESSION["Password"]."'");
while($row = mysqli_fetch_array($result)){
$FirstName= $row['FirstName'];
$LastName= $row['LastName'];
$StudentId = $row['StudentId'];
$Email= $row['Email'];
$Password = $row['Password'];
$Department = $row['Department'];
$Batch = $row['Batch'];
$Faculty= $row['Faculty'];
$Bio= $row['Bio'];
$ProfilePic=$row['ProfilePic'];
}
mysqli_close($con);
?>
Code for profile pic selection and database updation
<form method="post" enctype="multipart/form-data">
<div class="profilecard file-upload text-center" >
<img src="http://ssl.gstatic.com/accounts/ui/avatar_2x.png" class="avatar img-circle img-thumbnail" alt="avatar">
</div>
<br><br>
</div></hr>
<input type="file" class="text-center center-block file-upload" id="profileImage" name="profileImage" >
<button type="submit" name="save_profile" class="btn btn-primary btn-block">Save User</button>
</form>
script for bio updation on click and file upload
<script>
$(document).ready(function() {
$("#Bio").click(function () {
event.preventDefault();
<?php
$conn = mysqli_connect("localhost", "root", "", "juwsp");
$Bio= $_POST['addbio'];
$sql="UPDATE signup SET Bio='$Bio' WHERE StudentId='" . $_SESSION["StudentId"] . "' ";
$edit = mysqli_query($conn,$sql);
?>
});
var readURL = function(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$('.avatar').attr('src', e.target.result);
}
reader.readAsDataURL(input.files[0]);
}
}
$(".file-upload").on('change', function(){
readURL(this);
});
});
</script>
Code for uploading image file
<?php
$msg = "";
$msg_class = "";
$conn = mysqli_connect("localhost", "root", "", "juwsp");
if (isset($_POST['save_profile'])) {
// for the database
$profileImageName = $_FILES["profileImage"]["name"];
// For image upload
$target_dir = "images/";
$target_file = $target_dir . basename($profileImageName);
// VALIDATION
// validate image size. Size is calculated in Bytes
if($_FILES['profileImage']['size'] > 200000) {
$msg = "Image size should not be greated than 200Kb";
$msg_class = "alert-danger";
}
// check if file exists
if(file_exists($target_file)) {
$msg = "File already exists";
$msg_class = "alert-danger";
}
// Upload image only if no errors
if (empty($error)) {
if(move_uploaded_file($_FILES["profileImage"]["tmp_name"], $target_file)) {
$sql = "UPDATE signup SET ProfilePic='$profileImageName' WHERE StudentId='" . $_SESSION["StudentId"] . "'";
(mysqli_query($conn, $sql));
}
}
else {
}
}
else {
}
?>
