Give a radio button a hidden text value through selecting an image that is stored with that name in the database PHP/Html

Question

Hello infinitely more knowledgeable stack overflow community. I am trying to accomplish the following: There is this quick form a user fills out and part of that form is selecting a team mascot out of the radio buttons with their images below in the first picture. Then simply after they fill out all the required information it is then sent to the database along with the mascot choice. This is where I struggle because a user isn't supposed to know the image text name as I once did which would generate the mascots picture as you see in the second picture had I entered something like vader.jpg in the input box.

Now upon another thread I found here on stackoverflow: How to make a select image in form I followed the instructions and am at an impasse for what I could do to assign these selectable radio images their correct image names that are already stored on the server which in turn would generate them as you again see in the second picture.

This is the code I had where I could put in vader.jpg in the text field as an example and Vader's image would be generated for that team versus what I'm trying to do with the radio buttons.

Before:

<div class="form-group">
  <label for="mascot">Mascot</label>
  <input type="text" name="mascot" id="mascot" class="gt-input"
  value="<?php if($_SERVER['REQUEST_METHOD'] == 'POST') echo $mascot ?>">
</div>

After:

<div class="form-group">
  <label for="mascot">Mascot</label>
  <input type="radio" name='mascot' id="thing1"value="<?php if($_SERVER['REQUEST_METHOD'] == 'POST') echo $mascot ?>"/>
  <label for="thing1"></label>
  <input type="radio" name='mascot' id="thing2"value="<?php if($_SERVER['REQUEST_METHOD'] == 'POST') echo $mascot ?>"/>
  <label for="thing2"></label>
  <input type="radio" name='mascot' id="thing3"value="<?php if($_SERVER['REQUEST_METHOD'] == 'POST') echo $mascot ?>"/>
  <label for="thing3"></label>
  <input type="radio" name='mascot' id="thing4"value="<?php if($_SERVER['REQUEST_METHOD'] == 'POST') echo $mascot ?>"/>
  <label for="thing4"></label>
  <input type="radio" name='mascot' id="thing5"value="<?php if($_SERVER['REQUEST_METHOD'] == 'POST') echo $mascot ?>"/>
  <label for="thing5"></label>
</div>

CSS:

input[type=checkbox] {
  display:none;
}

input#thing1[type=radio] + label {
  background-image: url("../images/empire.jpg");
  border-color: white;
  border-style: solid;
  height: 80px;
  width: 80px;
  display:inline-block;
  padding: 0 0 0 0px;
}

input#thing2[type=radio] + label {
  background-image: url("../images/bb8.jpg");
  border-color: white;
  border-style: solid;
  height: 80px;
  width: 80px;
  display:inline-block;
  padding: 0 0 0 0px;
}

input#thing3[type=radio] + label {
  background-image: url("../images/leia.jpg");
  border-color: white;
  border-style: solid;
  height: 80px;
  width: 80px;
  display:inline-block;
  padding: 0 0 0 0px;
}

input#thing4[type=radio] + label {
  background-image: url("../images/ewok.jpg");
  border-color: white;
  border-style: solid;
  height: 80px;
  width: 80px;
  display:inline-block;
  padding: 0 0 0 0px;
}

input#thing5[type=radio] + label {
  background-image: url("../images/kyloRen.jpg");
  border-color: white;
  border-style: solid;
  height: 80px;
  width: 80px;
  display:inline-block;
  padding: 0 0 0 0px;
}

If there is a solution to this that I am blind to I thank you for the effort you put in to helping me achieve what I need accomplish.