Chosen e Select2 são as duas bibliotecas mais populares para estender caixas de seleção.
Ambos parecem ser mantidos ativamente, o Chosen é mais antigo e suporta jQuery e Prototype.
O Select2 é apenas jQuery, sua documentação diz que o Select2 é inspirado no Chosen, mas não detalha nenhuma melhoria feita (se houver) ou outros motivos para a reescrita.
Duas bibliotecas têm praticamente o mesmo conjunto de recursos, a única comparação que encontrei é uma página de teste jsperf um tanto inconclusiva.
Alguma dessas bibliotecas tem vantagens em relação à outra?
is licensed under the Apache License, Version 2.0 (the "Apache License") or the GNU General Public License version 2
Respostas:
A partir do Select2 3.3.1, abaixo está o que está documentado em seu README.md
fonte
O IMHO Escolhido é "mantido", mas não "mantido ativamente". 341 questões e 51 solicitações pull para Chosen. O Select2 tem 128 problemas e 25 solicitações pull. Eu acho que o padrão para estes é basicamente
Qualquer que você escolher, se o seu caso de uso estiver exatamente no ponto ideal, qualquer um funcionará. Caso contrário, você terá que escrever seus próprios textos ou personalizá-los intensamente. Em ambos os casos, a escolha de qual deles especificamente não é tão importante. Acho que vou apoiar @Andy Ray e @paul aqui que o Select2 é provavelmente a melhor escolha inicial.
fonte
Outra diferença que vale a pena mencionar é que
Chosen
é desenvolvida emSass
eCoffeeScript
enquantoSelect2
é simplesCSS
eJS
. É a minha opção pessoal queSass
eCoffeeScript
são camadas desnecessárias de complexidade que fazem a depuração difícil.Depois de experimentar os dois, decidi não usar nenhum - tentar
Select2
criar a funcionalidade do item acaba por ser um assunto muito cabeludo, já que você simplesmente não pode fazê-lo quando conectado a<select>
elementos - ele simplesmente não parecia bem pensado sobre os aros que eu teria para pular.Decidi usar o selectize.js, que apenas adiciona o novo
<option>...</option>
elemento ao DOM do formulário - e isso é sensato. Ele também usaLESS
- mas eu ignoraria isso e apenas adaptaria o compiladoCSS
diretamente no seu projeto.fonte
selectize.js
usa menos . Isso é menos um beco sem saída tecnológico do queSass
é?selected.js vs select2.js
ps. Tentarei atualizar esta resposta quando descobrir mais sobre os pontos ausentes
fonte
Primeiro, deixe-me dizer que o Chosen e o Select2 são dois ótimos plugins e essa é minha experiência pessoal sobre o Chosen. Tudo o que eles estão dizendo é verdade em relação aos Escolhidos.
O problema apontado por Pēteris Caune com
select
2 anos e ainda não existe uma correção oficial. Simplesmente não existe uma boa documentação para a API. Já foi apontado (assista a edição 671) muitas vezes, mas ainda não há nada. Levou quase dois anos para resolver esse problema, onde o escolhido basicamente não funcionaria se você ocultasse a divoverflow:hidden
antes de mostrá-la (e você deve usar umawitdh:X%
opção que você basicamente nunca saberia se não procurar o problema).Eu diria que o principal problema é a velocidade da correção, como disse o DelvarWorld na edição 92:
Escolhi o Chosen pela primeira vez pela licença MIT, mas eu tinha todos esses problemas (corte suspenso, sem encontrar a API, procurando horas para o estouro oculto), então decidi mudar para o select2 porque ele possui uma documentação melhor, sem erros de corte suspenso e correções mais rápidas.
fonte
Um recurso que funciona no Select2, mas não funciona no Chosen, é o
select
elemento interno que possuioverflow: hidden
ouoverflow: auto
.Problema correspondente ao Chosen: https://github.com/harvesthq/chosen/issues/86
fonte
.chosen-drop { z-index: 999999 !important;}
para corrigir isso com os escolhidosEncontrei algumas diferenças ao trabalhar com esses dois plugins:
Com o select2, você pode pesquisar em qualquer local da opção. Por exemplo, se você tiver uma opção chamada ABCDEFG e digitar CDE, você obterá essa opção nos resultados da pesquisa, mas com a opção escolhida precisará digitar AB .. e assim por diante para obter os resultados.
Descobri que, com conjuntos de dados maiores, o escolhido parece ser mais rápido que o select2, especialmente no IE.
fonte
Kingdom
na página de exemplo retornará, oUnited Kingdom
que parece uma maneira muito lógica de fazê-lo e você também pode especificar$("#element").chosen({ search_contains: true });
.O Select2 suporta dispositivos móveis, enquanto o Chosen se desativa especificamente em iPods, iPhones e Android móvel. Se você deseja usar caixas de seleção "estendidas" no celular, isso facilita sua escolha.
fonte
Minha experiência com o Select2 foi ótima em computadores, mas em dispositivos móveis sensíveis ao toque muito variados, com algumas peculiaridades sempre presentes. Por exemplo, no xperia st15i com ics e o menu suspenso do navegador de ações sempre se fechava devido ao foco no roubo de teclado. A única maneira de abri-lo novamente é tocar o menu dezenas de vezes, segurar o dedo por um segundo e outra magia vodu. Ou para começar a digitar enquanto a lista suspensa está fechada, e quantos usuários descobrirão isso?
O Selectize.js parece ser muito mais suave que o Select2, mas também possui problemas por conta própria no celular, por exemplo, quando o valor é selecionado ou inserido, move a página totalmente para a esquerda por algum motivo. Além disso, em dispositivos Android 2.x mais antigos que não suportam estouro, é impossível selecionar além das poucas opções principais, pois o teclado não aparece. :(
Ainda temos que testar o Chosen e talvez não seja uma má idéia ser desativado para dispositivos móveis, afinal, mas no final, o bom e velho menu suspenso funciona sempre e em qualquer lugar.
Atualização: agora também testei o Chosen, e é melhor em uma área: não funciona no celular por padrão (ótimo!), Mas possui problemas de filtragem de palavras. Por exemplo, não pesquisa no meio das palavras e, se você usar o & nbsp hack para ajustes, ele também ignorará as opções completas. De volta à prancheta.
fonte
search_contains: true
às suas opções. Veja harvesthq.github.io/chosen/options.htmlPor que eu escolhi select2 sobre Chosen
O principal recurso que select2 possui, que nenhum outro controle possui auto-magicamente, é "Limpar tudo", com o 'x' à direita do controle. Este é um recurso matador para o meu aplicativo. Não sei por que outras bibliotecas de aprimoramento de tags de seleção não possuem esse recurso.
fonte
O Select2 suporta AJAX Escolhido Não
O Select 2 é um pouco mais pesado em comparação ao tamanho escolhido.
Mudei para o Select2 porque não há suporte oficial para operações do ajax.
fonte