← Javascript

[Ajax] jQuery - Alterar valor de input

Lida 25686 vezes

Offline

muiomuio 
Membro
Mensagens 324 Gostos 0
Feedback +1

Troféus totais: 23
Trófeus: (Ver todos)
Super Combination Combination Topic Starter Poll Voter Level 4 Level 3 Level 2 Level 1 100 Posts 50 Posts

Ando desde ontem a martelar com isto e não encontro solução viável

Cenário: Um carrinho de compras com vários itens e a possibilidade de o utilizador adicionar / remover itens clicando em botões que alteram o valor de uma caixa de texto.

Problema: Existem várias caixas de texto na página.
Exemplo do problema: Ao clicar para adicionar 1 item do primeiro produto, adiciona 1 item a todos os produtos.

Objectivo: Fazer com que ao clicar no botão adicionar / remover item de um produto não altere o valor em todos os produtos.

O meu script:

Código: [Seleccione]
<script type="text/javascript">

$(function() {  
  
var valor = $('.qtd').val(); //devolve o valor da input (problema: todas as inputs têm a class qtd

$('.add').click(function() { // quando clico no botão adicionar
valor++; // incrementa +1 ao valor obtido da input
$('.qtd').attr('value', valor); // coloca o novo valor na input
});  
  
    $('.remove').click(function() {
if(valor > 1) { // para impedir que tenha valores negativos
   valor--; // valor = valor - 1
$('.qtd').attr('value', valor); // coloca o novo valor na input
     }  
     });  
 });  

</script>

Qualquer ajuda é bem vinda que neste momento estou sem saber o que fazer...
Offline

Gonçalo Martins 
Membro
Mensagens 229 Gostos 0
Troféus totais: 26
Trófeus: (Ver todos)
Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Level 5 Level 4 Level 3 Level 2 Level 1

http://docs.jquery.com/Utilities/jQuery.each

Mas terás que modificar o código. E talvez googlar alguns exemplos. Esta é a única opção que conheço.

Código: [Seleccione]
$(document).ready(function() {
  $(".add").each(function() {

var valor....

  });
});


EDIT:
Enganei-me no link acima o que queria dar era este:
http://docs.jquery.com/Core/each



Offline

Emanuel Santos 
Elite
Mensagens 848 Gostos 2
Feedback +25

Troféus totais: 25
Trófeus: (Ver todos)
Windows User Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Level 4 Level 3 Level 2 Level 1

Estás a usar mal o selector, tens que identificar univocamente o campo q queres alterar, o problema é que estás a seleccionar a classe, logo alteras vários campos.
Offline

muiomuio 
Membro
Mensagens 324 Gostos 0
Feedback +1

Troféus totais: 23
Trófeus: (Ver todos)
Super Combination Combination Topic Starter Poll Voter Level 4 Level 3 Level 2 Level 1 100 Posts 50 Posts

O problema que tinha é que o ID deve ser único, logo estava complicado associar 3 itens.

No final acabei por optar por javascript que com um código de 3 linhas resolveu a situação.

Depois já entretido pela situação acabei por desenvolver uma resolução com jQuery usando o atributo nome e id dos elementos.
Assim que tiver tempo crio um tutorial e partilho com o resto do pessoal.

Obrigado a todos pela ajuda.

Já agora escareta, podias desenvolver o teu código um cadinho mais?

 

Código: [Seleccione]
$(document).ready(function() {
  $(".add").each(function() {

var valor....

  });
});