Outubro29
Bom dia pessoal, vou todo dia enviar algumas dicas rápidas referente a JavaScript, e frameworks JavaScripts como: JQuery, Prototype, e afins
Vamos começar hoje sem nenhum framework, algo bem útil, e que ontem mesmo estava pesquisando para usar, que é a contagem de itens selecionados de um Select Multiplo.
O Menu:
<select name="select" multiple="multiple" style="height:250px; " id="select">
<option value="Opção 1">Opção 1</option>
<option value="Opção 2">Opção 2</option>
<option value="Opção 3">Opção 3</option>
<option value="Opção 4">Opção 4</option>
<option value="Opção 5">Opção 5</option>
<option value="Opção 6">Opção 6</option>
<option value="Opção 7">Opção 7</option>
<option value="Opção 8">Opção 8</option>
<option value="Opção 9">Opção 9</option>
<option value="Opção 10">Opção 10</option>
</select>
Agora o JavaScript:
<script type="text/javascript">
function verificaContagem(){
var select = document.getElementById(’select’).childNodes;
var child = select.length;
var quantos = 0;
for(var i = 0;i < child;i++){
if(select[i].selected)
quantos++;
}
alert(’Você selecionou’+quantos+’ itens do Select’);
}
</script>
Esse Script foi feito com Lucas Mezencio => [lucasmezencio.com].
Agora caso queira colocar alguma limitação no script, para selecionar somente 3 ou 4 itens do menu, é fácil, basta adicionar um if, com o retorno em false, exemplo:
<script type="text/javascript">
function verificaContagem(){
var select = document.getElementById(’select’).childNodes;
var child = select.length;
var quantos = 0;
for(var i = 0;i < child;i++){
if(select[i].selected)
quantos++;
}
if(quantos<3) {
alert(’Você selecionou menos de 3 valores! Por favor, selecione 3 valores!’);
return false;
}
if(quantos>3) {
alert(’Você selecionou mais que 3 valores, por favor, selecione somente 3 valores!’);
return false;
}
}
</script>
Para aplicar isso a um botão por exemplo, basta aplicar com o evento onClick, "return verificaContagem();", veja o exemplo:
<input type=’submit’ value=’Atualizar Home!’ onclick=’return verificaContagem();’>
É isso
A próxima vai ser um source para fazer os famosos stickers com JQuery.