Используйте подполя WTForms RadioField для отображения изображения в Flask - PullRequest
Новая
       21

Используйте подполя WTForms RadioField для отображения изображения в Flask

0 голосов
/ 27 апреля 2018

Я использую форму WTForm, чтобы попытаться передать путь к изображению, которое я хочу отобразить в HTML. Моя форма выглядит примерно так 

from flask_wtf import FlaskForm
from wtforms import RadioField

class SelectStyleForm(FlaskForm):
     images = RadioField('style image.',
                         choices=[(value1, label1),(value2, label2),...])

Моя цель - перебрать различные варианты, чтобы отобразить изображение, связанное с каждым путем, рядом с соответствующим переключателем. Мой HTML-шаблон выглядит так: 

 {% block content %}

 <form method=post>
      {% for subfield in styleform.images %}
           <td>{{subfield}}</td>
           <p>{{subfield.label}}</p>
           <img src="{{url_for('data_path', filename=subfield.label)}}"/>
      {% endfor %}
 </form>
 {% enblock %}

прямо сейчас, радио-кнопка отображается вместе с именем файла (которое записано в теге <p>), но я не могу найти способ повлиять на то же имя на filename.

Прямо сейчас значение, к которому оно относится: 

<label for="images-1">value1</label>

Есть ли способ, которым tp влияет на "правильное" значение в функции url_for? Обратите внимание, что я бы также принял решение, для которого используется часть value различных вариантов, так как они должны быть по одному и тому же пути

1 Ответ

0 голосов
/ 27 апреля 2018

Кроме того, поигравшись с разными методами, я обнаружил, что каждое подполе имеет атрибут data, в котором хранится строка части label.

Так что мой код работает просто путем изменения источника изображения: 

<img src="{{url_for('data_path', filename=subfield.data)}}"/>

Мое лучшее предположение заключается в том, что атрибут .label уже приписан чему-то другому в функции url_for, и это не позволяет ему получить доступ к строке, соответствующей метке.

Не стесняйтесь поправлять меня, если я ошибаюсь или не стесняйтесь опубликовать более подробный ответ!

...