Run Jquery on multiple inputs

1

How would I do to run jquery with multiple input fields to be changed?

I need to be able to put the quantity of each product by clicking minus and .plus

I have this Html

<div class="quantity">
       <input type="button" value="+" class="plus">
       <input id="value" data-formid="" step="1" max="99" min="1" title="Qty" class="qty" type="number" name="prod[2385]" value="1" size="4">
       <input type="button" value="-" class="minus">
    </div>

    <div class="quantity">
       <input type="button" value="+" class="plus">
       <input id="value" data-formid="" step="1" max="99" min="1" title="Qty" class="qty" type="number" name="prod[2386]" value="1" size="4">
       <input type="button" value="-" class="minus">
    </div>

And this Jquery

$('.plus').click(function() { changeValue(1); });
$('.minus').click(function() { changeValue(-1); });

var formID=data("formid");

function changeValue(val) {
    var container = $('#value'+formID);
    var current = parseInt(container.val(), 10);
    container.val(Math.max(0, current + val).toString());
}
    
asked by anonymous 28.08.2018 / 13:29

1 answer

2

I believe the script below meets what you want:

$('.plus').click(function() { 
   //Pega o valor do input que está na mesma div do botão clicado
   var valorAtual = parseInt($(this).closest('.quantity').find('[type=number]').val());
   //Atribui ao input o valor atual somando + 1
   if (valorAtual < 99){
       $(this).closest('.quantity').find('[type=number]').val(valorAtual + 1);
   }
});

$('.minus').click(function() { 
   //Pega o valor do input que está na mesma div do botão clicado
   var valorAtual = parseInt($(this).closest('.quantity').find('[type=number]').val());
   //Atribui ao input o valor atual subtraindo 1
   if (valorAtual > 1){
       $(this).closest('.quantity').find('[type=number]').val(valorAtual - 1);
   }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><divclass="quantity">
       <input type="button" value="+" class="plus">
       <input id="value" data-formid="" step="1" max="99" min="1" title="Qty" class="qty" type="number" name="prod[2385]" value="1" size="4">
       <input type="button" value="-" class="minus">
    </div>

    <div class="quantity">
       <input type="button" value="+" class="plus">
       <input id="value" data-formid="" step="1" max="99" min="1" title="Qty" class="qty" type="number" name="prod[2386]" value="1" size="4">
       <input type="button" value="-" class="minus">
    </div>
    
28.08.2018 / 13:56