Опция выбора Django - отображение изображения в шаблоне - PullRequest
Новая
       4

Опция выбора Django - отображение изображения в шаблоне

0 голосов
/ 02 июня 2018

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

template 

<select id="fabric-select" name="select-id">
    {% for item in fabric %}
        <option value="{{item.id}}">{{item.fabric_cover.url}}</option>
        <option value="{{item.id}}"><img src="{{item.fabric_cover.url}}" alt="fabric picture">{{item.name}}</option> 
        <option value="{{item.id}}" data-image="{{item.fabric_cover.url}}"></option>
    {% endfor %}
  </select>

Пробовал разные варианты, но ни один из них не показывает само изображение.Первый вариант просто показывает мне статическую ссылку на изображение.Второй вариант показывает имя, но ничего больше, а третий вариант показывает пустое поле.

С моей точки зрения: 

class ProductListView(ListView):
    queryset = Product.objects.all()
    def get_context_data(self, *args, **kwargs):
        context = super(ProductListView, self).get_context_data(*args, **kwargs)
        cart_obj, new_obj = Cart.objects.new_or_get(self.request)
        context['cart'] = cart_obj

        fabric_obj = Fabric.objects.all()
        context['fabric'] = fabric_obj

        return context

Модель 

class Fabric(models.Model):
    name         = models.CharField(max_length=120)
    fabric_cover = models.ImageField(upload_to='fabric_images', blank=False)

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

1 Ответ

0 голосов
/ 02 июня 2018
Элемент

<option> не поддерживает дочерние элементы внутри него.Вам необходимо использовать библиотеку javascript для преобразования параметров в набор списков (<li>).Вот пример https://www.addwebsolution.com/blog/adding-image-select-list-with-cross-browser-compatibility

...