如何通过单击图像本身来存储图像文件路径

Question

Im attempting to allows users to choose from a simple set of 4 avatars that they can use as their profile picture.

I've tried using:

<input type="image" class="profile-image-icon" src="img/avatar/avatar1.png" name="image" id="image">

But I finally found that using input type="image" is only for using an image as a submit button.

The avatars in question are already in my img/avatar folder, which I then only want to store the image path in the database.

I have echoed any error messages on changeProfile.php, which is returning "Nothing getting through" so I know it is an issue with my form, but I am unsure how to proceed.

Is there anyway to allow the user to simply click on the image and it 'POSTS' to changeProfile.php where I can then retrieve the file path to store in my database?

Thanks for any help provided!

edit_profile_image.php

<form class="profile-image-form" method="POST" action="profileChanged.php">                       

<fieldset>
<div class="image-control">
<input type="image" class="profile-image-icon"src="img/avatar/avatar1.png" name="image" id="image">
</div>
<?php echo "<input type='text' class='form-control' id='studentNumber' name='studentNumber'  value='$studentID'>"; ?>  
</fieldset>                      

</form> 

changeProfile.php

if (isset($_POST['image'])) {

$image = mysqli_real_escape_string($conn, $_POST['image']);
$studentNumber = mysqli_real_escape_string($conn, $_POST['studentNumber']);

} else {
    echo "Nothing coming thorugh";
}