Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
4
respostas

selecionar um unico elemento entre varios com a mesma classe

Referente ao curso jQuery: avance na biblioteca mais popular do mercado parte 2

por Gabriel Bartholo Batista
| 420.4k xp | 425 posts

Boa noite,

possuo uma pagina quem vem do meu server, e tenho uma lista de itens que é preenchida com um <c:forEach> em java, ou seja quantos itens voltar do meu server, mais linhas com as mesmas classe vou ter, mas quero selecionar apenas um especifico com a mesma classe, exemplo:

<div class="car-vqs">
                    <p>R$ <spam class="preco-item">${item.produto.preco }</spam></p>
                    <div class="trash">
                            <button type="submit" class="button-trash">
                                <p class="produtoId" style="display: none;">${item.produto.id}</p>
                                <span class="icon-trashcan2"></span>
                            </button>

                            <input type="hidden" name="${_csrf.parameterName }" value="${_csrf.token }" />
                            <input class="quant-trash" type="number" min="0"  name="quantidade" value="${pedido.getQuantidade(item)}"/>
                            <p class="null-quantidade">${pedido.getQuantidade(item)}</p>
                            <span class="icon-refresh"></span>
                    </div>    
                    <p class="total-pedido-3">R$ ${pedido.getTotalItem(item) }</p>
                </div>

eu tenho um evento de clique no meu elemento com a classe button-trash, que ao clicar no botão eu pego o valor do input com a classe quant-trash, mas eu quero apenas o valor daquela linha especifica, mas quando seleciono o elemento ele pega o primeiro.

não sei se fui claro, mas simplificando, quero selecionar um elemento especifico com a mesma classe de outros.

obrigado.

4 respostas
por Jullie
| 87.1k xp | 12 posts

Olá, Gabriel!

Para resolver este problema, você deveria criar ids ao iterar estes elementos semelhantes.

Você precisa de ter um identificador único para selecionar o seu elemento. Para uma bibliografia super completa sobre seletores, leia mais aqui: http://www.maujor.com/tutorial/guia-completo-seletores-css3.php

Sugiro que também assista o curso de HTML + CSS : )

Uma sugestão de resolução: ao iterar a sua lista no server side, adicione um id em cada elemento. Pode ser "item1", "item2", e por aí vai. Você pode criar uma variável auxiliar que vai iterando em seu loop, ou mesmo utilizar um for normal.

Espero ter ajudado.

Um abraço!

solução!
por Lucas Cuculo Badiale
| 261k xp | 1 posts

Olá Gabriel,

Complementando a resposta da Jullie, também é possível pegar o valor de .quant-trash utilizando jQuery puro.

Assumindo que você tenha colocado um evento de click no .button-trash usando jQuery, é possível implementá-lo da seguinte maneira:

$(document.body).on("click", ".button-trash", function (ev) {
    var buttonTrash = $(ev.target);
    var quantTrash = buttonTrash.siblings(".quant-trash");
    var quantTrashValue = quantTrash.val();
   // .... utilizar o valor de quantTrash para alguma coisa
});

Todo listener de evento de jQuery recebe um objeto do tipo Event que possui uma propriedade target, que é o elemento que recebeu o evento.

Então, com este objeto na mão, podemos convertê-lo para um objeto jQuery e utilizar o método siblings, que retorna todos os nós que estão no mesmo nível do nó selecionado (.button-trash nesse caso).

Daí podemos simplesmente pegar o valor do input, usando o método val.

por Gabriel Bartholo Batista
| 420.4k xp | 425 posts

Obrigado Jullie pela ajuda!!

por Gabriel Bartholo Batista
| 420.4k xp | 425 posts

Lucas valeu cara, eu entendi sua resposta, não deu certo, mas pela resposta eu percebi que nesse caso meu botão, e meu input são irmão então voltei ao PAI, com o parent() e ai consegui selecionar.

muito obrigado.