Increase in one field and Decrement in other JavaScript

0

I am in a project where several% of spinners when incrementing in one field it decreases in another.

Example: In the 1st field I have the value 2. In the 2nd field I have the value 4. By clicking to decrease in the 1st field it will pass the subtracted value to the 2nd field with values 1 and 5 respectively. p>

function id(el) {
  return document.getElementById(el);
}

function menos(id_qnt) {
  var qnt = parseInt(id(id_qnt).value);
  if (qnt > 0)
    id(id_qnt).value = qnt - 1;
}

function mais(id_qnt) {
  id(id_qnt).value = parseInt(id(id_qnt).value) + 1;
}
<form action="" method="post">
  <input type="text" name="quantidade" id="quantidade1" value="0" size="1" readonly="readonly" />
  <input type="button" value="+" onclick="mais( 'quantidade1' )">
  <input type="button" value="-" onclick="menos( 'quantidade1' )">
</form>

<form action="" method="post">
  <input type="text" name="quantidade" id="quantidade2" value="0" size="1" readonly="readonly" />
  <input type="button" value="+" onclick="mais( 'quantidade2' )">
  <input type="button" value="-" onclick="menos( 'quantidade2' )">
</form>

<form action="" method="post">
  <input type="text" name="quantidade" id="quantidade3" value="0" size="1" readonly="readonly" />
  <input type="button" value="+" onclick="mais( 'quantidade3' )">
  <input type="button" value="-" onclick="menos( 'quantidade3' )">
</form>

I found this sample code

    
asked by anonymous 29.05.2018 / 14:53

1 answer

0

Basically, just put in the function of menos who will be awarded one more, eg:

function id(el) {
  return document.getElementById(el);
}

function menos(id_qnt, id_add_qnt) {
  var qnt = parseInt(id(id_qnt).value);
  if (qnt > 0) {
    id(id_qnt).value = qnt - 1;
    id(id_add_qnt).value =
        parseInt(id(id_add_qnt).value) + 1;
  }
}

function mais(id_qnt) {
  id(id_qnt).value = parseInt(id(id_qnt).value) + 1;
}
<div>
  <input type="text" name="quantidade" id="quantidade1" value="0" size="1" readonly="readonly" />
  <input type="button" value="+" onclick="mais( 'quantidade1' )">
  <input type="button" value="-" onclick="menos( 'quantidade1' ,'quantidade2')">
</div>

<div>
  <input type="text" name="quantidade" id="quantidade2" value="0" size="1" readonly="readonly" />
  <input type="button" value="+" onclick="mais( 'quantidade2' )">
  <input type="button" value="-" onclick="menos( 'quantidade2' ,'quantidade3')">
</div>

<div>
  <input type="text" name="quantidade" id="quantidade3" value="0" size="1" readonly="readonly" />
  <input type="button" value="+" onclick="mais( 'quantidade3' )">
  <input type="button" value="-" onclick="menos( 'quantidade3' ,'quantidade1')">
</div>

At least the initial logic for the comments.

    
29.05.2018 / 16:04