Поле django с использованием картинок вместо текста

Если я выбираю в HTML одно из изображений, входным значением которого является radio, и отправляю, выбранное изображение доставляется модели, и, наконец, я хочу снова получить выбранное изображение из HTML. Но я даже не могу получить подсказку. Что мне делать? И мне также интересно, как соединить и использовать это с forms.py и html. Я хочу знать точный ответ, потому что поле image установлено как временная мера.

models.py '''

class Guest(models.Model):
author = models.CharField(null=True,max_length=20)
content=models.TextField()
created_at =models.DateTimeField(auto_now_add=True)
sticker=models.ImageField(label="Decorate the picture next to it!",widget=models.RadioSelect(choices=STICKER_CHOICES))

def __str__(self):
    return f'{self.author},{self.content}'

'''

main html

Sticker: 
                    <div class="table">
                       <input type = "radio" name = "major" style="margin-left:15px;"><img src="{% static 'diary/css/images/sticker/boat.png' %}" style="height:80px;width:80px;"></input>
                       <input type = "radio" name = "major" style="margin-left:15px;"><img src="{% static 'diary/css/images/sticker/airplane.png' %}" style="height:80px;width:80px;"></input>
                       <input type = "radio" name = "major" style="margin-left:15px;"><img src="{% static 'diary/css/images/sticker/bird.png' %}" style="height:80px;width:80px;"></input>
                    </div>
                    <div class="table">
                       <input type = "radio" name = "major" style="margin-left:15px;"><img src="{% static 'diary/css/images/sticker/board.png' %}" style="height:80px;width:80px;"></input>
                       <input type = "radio" name = "major" style="margin-left:15px;"><img src="{% static 'diary/css/images/sticker/fish.png' %}" style="height:80px;width:80px;"></input>
                       <input type = "radio" name = "major" style="margin-left:15px;"><img src="{% static 'diary/css/images/sticker/starfish.png' %}" style="height:80px;width:80px;"></input>
                    </div>
                    <div class="table">
                       <input type = "radio" name = "major" style="margin-left:15px;"><img src="{% static 'diary/css/images/sticker/turtle.png' %}" style="height:80px;width:80px;"></input>
                       <input type = "radio" name = "major" style="margin-left:15px;"><img src="{% static 'diary/css/images/sticker/shell.png' %}" style="height:80px;width:80px;"></input>
                       <input type = "radio" name = "major" style="margin-left:15px;"><img src="{% static 'diary/css/images/sticker/palm.png' %}" style="height:80px;width:80px;"></input>
                    </div>

HTML элементы радиоввода являются самозакрывающимися, поэтому либо <input>, либо <input /> без дочерних элементов. В вашем примере HTML элемент image является дочерним (внутри открывающего и закрывающего тега) элемента input, что означает, что <img> не связан с радиовводом.

Вместо этого вам нужно добавить атрибут value к входным данным, которые передаются вашему бэкенду python.

Вот пример того, как должен выглядеть ваш HTML

                <div class="table">
                   <input type = "radio" name = "major" style="margin-left:15px;" value="boat"><img src="{% static 'diary/css/images/sticker/boat.png' %}" style="height:80px;width:80px;">
                   <input type = "radio" name = "major" style="margin-left:15px;" value="airplane"><img src="{% static 'diary/css/images/sticker/airplane.png' %}" style="height:80px;width:80px;">
                   <input type = "radio" name = "major" style="margin-left:15px;" value="bird"><img src="{% static 'diary/css/images/sticker/bird.png' %}" style="height:80px;width:80px;">
                </div>
                <div class="table">
                   <input type = "radio" name = "major" style="margin-left:15px;" value="board"><img src="{% static 'diary/css/images/sticker/board.png' %}" style="height:80px;width:80px;">
                   <input type = "radio" name = "major" style="margin-left:15px;" value="fish"><img src="{% static 'diary/css/images/sticker/fish.png' %}" style="height:80px;width:80px;">
                   <input type = "radio" name = "major" style="margin-left:15px;" value="starfish"><img src="{% static 'diary/css/images/sticker/starfish.png' %}" style="height:80px;width:80px;">
                </div>
                <div class="table">
                   <input type = "radio" name = "major" style="margin-left:15px;" value="turtle"><img src="{% static 'diary/css/images/sticker/turtle.png' %}" style="height:80px;width:80px;">
                   <input type = "radio" name = "major" style="margin-left:15px;" value="shell"><img src="{% static 'diary/css/images/sticker/shell.png' %}" style="height:80px;width:80px;">
                   <input type = "radio" name = "major" style="margin-left:15px;" value="palm"><img src="{% static 'diary/css/images/sticker/palm.png' %}" style="height:80px;width:80px;">
                </div>
Вернуться на верх