Select personalizado
Como estilizar o select e usar outras opções do select2
Utilizamos o plugin Select2 para alterar o select
padrão. Todas as opções e configurações do plugin original podem ser feitas, mas adicionamos algumas confidurações e atalhos no padrão LocawebStyle, listadas abaixo:
Simples
Para ativar o selec2 basta usar o HTML de select
padrão, com a classe ls-select
Apenas listas com mais de 10 itens possuem o campo de busca e exibem 10 itens visíveis dentro da rolagem. Para ocultar o campo de busca em uma lista maior, insira o atributo data-visible
com o valor -1
.
Seleção de múltiplos valores
O HTML é idêntico ao simples, com o atributo multiple
.
O select também deve estar com a largura definida.
Placeholder
Para inserir um placeholder, basta adicionar o atributo placeholder="valor"
.
Exemplos sem valor inicial.
Exemplos com valor inicial.
Estilos de validação
Para estilizar os campos nas validações adicionar as classes: has-success
, has-warning
ou has-error
no elemento pai dos <select>
.