2015-03-08 4 views
10

Итак, у меня есть следующий код для выпадающего списка сделанного с начальной загрузкой:Как сделать выпадающее меню Bootstrap?

<div class="btn-group"> 
    <button id="landKapitein" type="button" data-toggle="dropdown" class="btn btn-default dropdown-toggle">Land 
     <span class="caret"></span> 
    </button> 
    <ul class="dropdown-menu"> 
     <li><a role="menuitem" tabindex="-1" href="#">België/Belgique</a></li> 
     <li><a role="menuitem" tabindex="-1" href="#">Deutschland</a></li> 
     <li><a role="menuitem" tabindex="-1" href="#">France</a></li> 
     <li><a role="menuitem" tabindex="-1" href="#">Nederland</a></li> 
     <li><a role="menuitem" tabindex="-1" href="#">United Kingdom</a></li> 
    </ul> 
</div> 

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

+0

Вместо того, чтобы использовать элемент 'select' в качестве предложенного @samuelms, вы нашли другое решение? – John

ответ

2

Вместо этого вы можете использовать select element и применять его к своему тегу?

<select class="form-control" required> 
    <option>België/Belgique</option> 
    <option>Deutschland</option> 
    <option>France</option> 
    <option>Nederland</option> 
    <option>United Kingdom</option> 
</select> 

См., В частности, this SO question.

+1

Вы должны изменить стиль элемента 'select', чтобы получить тот же стиль, что и способ загрузки с помощью кнопки и списка. Это может быть не то, что вы хотите сделать. – John

+0

Если кто-то хочет использовать ui.bootstrap.dropdown, тогда выберите, вариант - нет. Можно ли это сделать вместе с ui.bootstrap.dropdown? – Tomo

4

Если мы просто разместим требуемый в теге select и <option value="">None</option> в опции, он будет работать для проверки. Я ссылаюсь на этот page.

Он работает для выбора, который должен быть сделан среди предоставленного значения.

Но я хотел бы знать, как написать специальное сообщение проверки, поступающее по умолчанию, как это сообщение.? enter image description here

<form action="demo_form.asp"> 
    <select required> 
     <option value="">None</option> 
     <option value="volvo">Volvo</option> 
     <option value="saab">Saab</option> 
     <option value="mercedes">Mercedes</option> 
     <option value="audi">Audi</option> 
    </select> 
    <input type="submit"> 
    </form> 

Приведенный выше код работает отлично для проверки, как «Выбор элемента в списке, прежде чем представить».

Смежные вопросы