Раскрывающийся список с цветовыми схемами в качестве параметров

0

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

Я пытался использовать Bootstrap Select (http://silviomoreto.github.io/bootstrap-select/) для этого, со следующим кодом:

<select class="selectpicker" name="color_scheme" id="color_scheme">
      <option value="1" data-content="<div style='height:15px;width:15px;background:red;float:left'></div><div style='height:15px;width:15px;background:green;float:left'></div><div style='height:15px;width:15px;background:blue;float:left;clear:right'></div>"></option>
      <option value="2" data-content="<div style='height:15px;width:15px;background:gray;float:left'></div><div style='height:15px;width:15px;background:orange;float:left'></div><div style='height:15px;width:15px;background:yellow;float:left'></div>"></option>
</select>

Это плохо работает, хотя из-за плавания. Есть ли способ исправить это, или есть лучший способ добиться того, что мне нужно?

Теги:
select
bootstrap-select
color-scheme

1 ответ

0
Лучший ответ

Я закончил использование Select2 с параметром templating:

<select>
    <option value="0" data-foo="bar">option one</option>
    ...
</select>

function format(state) {
    var originalOption = state.element;

    return "<img class='flag' src='images/flags/" + state.id.toLowerCase() + ".png' alt='" + $(originalOption).data('foo') + "' />" + state.text;
}

Ещё вопросы

Сообщество Overcoder
Наверх
Меню