0

Preciso buscar todos os checkboxes CHECKED de uma <div> na qual possui uma outra <div> filha que esta, possue um <input type="checkbox"> via jQuery.

Segue a estrutura:

<div class="metro perfil-filtro-expander-filtrados perfil-filtro-expander-overflow acoesFiltradas" id="acoesFiltradas">
     <--! item 1 -->
     <div style="padding-bottom: 10px;">
          <input id="@item.SelectedValue" type="checkbox" />
          <label for="@item.SelectedValue">
          <b>@item.Title</b>
          <br />
          <span class="perfil-filtro-expander-descricao">
               @item.Description
          </span>
          </label>
    </div>
    <--! item 2 -->
    <div style="padding-bottom: 10px;">
         <input id="@item.SelectedValue" type="checkbox" />
         <label for="@item.SelectedValue">
         <b>@item.Title</b>
         <br />
         <span class="perfil-filtro-expander-descricao">
              @item.Description
         </span>
         </label>
    </div>
    <--! item 3 -->
    <div style="padding-bottom: 10px;">
         <input id="@item.SelectedValue" type="checkbox" />
         <label for="@item.SelectedValue">
         <b>@item.Title</b>
         <br />
         <span class="perfil-filtro-expander-descricao">
               @item.Description
         </span>
         </label>
    </div>
</div>

jQuery:

$("#copiarParaTodasAcoes").click(function () {
    $(".acoesFiltradas :input:checked").each(function () {
        alert('teste');
    });
});

Botão:

<a href="">
   <img class="perfil-expander-botoes" id="copiarParaTodasAcoes" src="~/Images/tecbox/icons/expander-copy-icon.png" />
</a>
4
  • O erro esta no jeito que você esta chamando no jQuery $(".acoesFiltradas :input:checked") mude para $(".acoesFiltradas input:checked") 20/08/2015 às 18:08
  • nenhum feedback.. o alerta não é exibido ainda. 20/08/2015 às 18:11
  • Não prestei atenção em todo o código, analisando melhor, verifiquei que o erro esta no seu botão, a imagem esta dentro de um link que esta com o link para a mesma página <a href="">, ele tenta chamar o javascript, porém a página já é redireciona no mesmo momento. link do seu código funcionando jsfiddle.net/dbk7a1os, mudei o javascript e html do botão. 20/08/2015 às 18:16
  • não esta funcionando aqui, não sei por que motivos... Por favor, insira o código baseado na minha pergunta como resposta. 20/08/2015 às 18:41

2 Respostas 2

2

Você pode alterar o seu código do botão e javascript por esses:

Botão (a mudança esta em por o id na tag do link <a> e remover da imagem)

<a href="" id="copiarParaTodasAcoes">
   <img class="perfil-expander-botoes" src="~/Images/tecbox/icons/expander-copy-icon.png" />
</a>

Javascript: (adicionado o preventDefault() para que ignore a ação principal do link e removi os ':' do seletor do input)

$("#copiarParaTodasAcoes").click(function (e) {
    e.preventDefault();

    $(".acoesFiltradas input:checked").each(function () {
        alert('teste');
    });
});

O restante do html continua o mesmo. link do exemplo funcionando

Obs.: Testei no Firefox e Chorme.

11
  • Sem resposta ainda... não sei por que motivos... acho que é por que estou estilizando o checkbox como o da seguinte forma: pt.stackoverflow.com/questions/80628/… verifique se isso pode afetar, por favor... verifique que o checkbox não alterna para true ou false o checked. Engraçado que nos testes aqui eu ponho um alert na primeira linha na function e ele não é mais exibido também. 20/08/2015 às 18:59
  • Apresenta algum erro no console do browser? se puder passar alguma url de homologação para darmos uma olhada 20/08/2015 às 19:01
  • pior que não apresenta nada... sem feedback algum! E também não possuo a Url... se você entrar no link em que falei, verá as classes que editam o meu checkbox através da div com classe 'metro'. 20/08/2015 às 19:04
  • É alguma coisa que esta dando conflito, joguei os css do link que você passou e funcionou certinho (apenas o primeiro item é selecionado pelo fato deles possuírem o mesmo id) - Link 20/08/2015 às 19:07
  • 1
    Você pode usar o seletor :not(), ficaria assim $(".acoesFiltradas input:not(:checked)") 20/08/2015 às 21:02
1

Retirar o elemento <a> que está encapsulando o elemento <img>, pois este não possui propósito. A menos que você prefira retirar o elemento <img> e passar o src da imagem como background do elemento <a>. Neste caso será necessario utilizar o seguinte script: e.preventDefault();

$("#copiarParaTodasAcoes").on('click', function (e) {
    // caso seja utilizada a tag <a>: e.preventDefault();

    // o filtro para selecionar os inputs 'checked'
    // pode ser feito com o 'find' do jquery
    // $('.acoesFiltradas').find('input:checked')

    $(".acoesFiltradas input:checked").each(function () {
        alert(this.id);
    });
});
1
  • não obtive resposta também, por favor, leia meu comentário que esta na resposta do Jeferson. 20/08/2015 às 18:59

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .