Bom dia galera, após tanto tempo sem uma novidade, este é nosso primeiro tutorial nesta nova etapa do blog.
Iniciamos com uma dúvida simples, que normalmente pega no desenvolvimento utilizando jQuery: Como pegar o valor do elemento que foi selecionado, como por exemplo um radio ou um checkbox?
Bem, como sabemos, o jQuery possui os chamados seletores que são um poderoso conjunto de ferramentas para trabalharmos com a combinação de elementos em um documento.
Na página oficial do jQuery, podemos ter informações mais detalhadas sobre cada seletor, veja aqui: https://api.jquery.com/category/selectors/.
O uso de um seletor, pode ser feita de diversas formas. Posso dizer que o uso mais comum, é utilizando o ID do elemento, por exemplo $(“#idaqui”).val(), ao tipo ou mesmo à classe atribuída, por exemplo $(“.nomedaclasse”).val().
Uma observação importante, que a documentação do jQuery nos deixa é, que, para usar qualquer um dos meta-caracteres (como! “# $% & ‘() * +,. /:; <=>? @ [\] ^` {|} ~) Como uma parte literal de um nome, deve ser escapado com duas contrabarras: \\. Por exemplo, um elemento com id = “foo.bar”, pode usar o seletor $ (“# foo \\. bar”). A especificação CSS do W3C contém o conjunto completo de regras sobre seletores CSS válidos Também é útil a entrada de blog de Mathias Bynens em seqüências de escape de caracteres CSS para identificadores, assim, é importante observar essa regra, para que não hajam erros em nossas escritas.
Voltando ao foco de hoje, então como vamos pegar o valor do elemento que foi selecionado? Bem simples.
O código abaixo, pega um radio ou checkbox, selecionado no documento, veja:
1 |
$("input[name='nome_do_elemento']:checked").val(); |
Como os elementos do tipo radio e checkbox, normalmente são utilizadosem grupos de opções, recebendo o mesmo nome em um formulário, diferentes IDs, a descoberta do item selecionado é mediante seu nome, mais a validação do checked para true.
Bora brincar um pouco mais com seletores?
Fortea abraço.
