LOCAWEB STYLE

Documentação Locaweb Style

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>.