Count radio-type inputs that are: checked

Question

Count radio-type inputs that are: checked

Navigation

#1 by (2 votes)
#2 by (1 votes)

0

I have two inputs in each group with name equal, where each has values different, integer and half

Using if and else or otherwise, I would like to count the inputs that will be checked .

When I speak of if and else I imagine it would be a way of "If the button is checked add ++; otherwise - subtract;

As my knowledge is very shallow, I would love to comment on the logic of such a function.

link

I let you see more or less the idea. I commented the last else in the javascript because this is already running a lot.

Example of situation would be as follows,

The program started
Check the 1st input of grupo[0] .
See the result - 1 and 0 will appear.
Select 2nd% with% - 0 and 1 will appear.
When I started to choose grupo[0] , it was to be 1 and 0 again, but then the first mismatch happens - Showing 1 and 1.
And so on, go along with the choices of the other inputs.

jquery input radiobutton

asked by anonymous 01.02.2018 / 08:31

2 answers

1

Basically I changed the selector, to search the <input> by name and to bring only the checkados.

Then I check the marked values and increment the variables inteiro and metade .

function resultado(){
  var opcoes  = [];
  var inteiro = 0;
  var metade  = 0;
  opcoes[0] =document.querySelector("input[name='nome[]']:checked");
  opcoes[1] =document.querySelector("input[name='nome[1]']:checked");
  opcoes[2] =document.querySelector("input[name='nome[2]']:checked");

  for(i=0;i<opcoes.length;i++){
    if(opcoes[i]){ //Verifico se uma opção foir marcada
      if(opcoes[i].value == 'inteiro')//se foi marcada verifico o valor
        inteiro++;
      else
        metade++
    }
  }
  
  console.log('A quantidade de "inteiro" marcados é:' + inteiro);
  console.log('A quantidade de "metade" marcados é:' + metade);
}

<table>
  <tr>
    <td>
      <input type="radio" name="nome[]" value="inteiro" id="i"/>
      <label for="i">inteiro[ ]</label>
    </td>
    <td>
      <input type="radio" name="nome[]" value="metade" id="m"/>
      <label for="m">metade[ ]</label>
    </td>
  </tr>
  <tr>
    <td>
      <input type="radio" name="nome[1]" value="inteiro" id="i1"/>
      <label for="i1">inteiro[1]</label>
    </td>
    <td>
      <input type="radio" name="nome[1]" value="metade" id="m1"/>
      <label for="m1">metade[1]</label>
    </td>
  </tr>
  <tr>
    <td>
      <input type="radio" name="nome[2]" value="inteiro" id="i2"/>
      <label for="i2">inteiro[2]</label>
    </td>
    <td>
      <input type="radio" name="nome[2]" value="metade" id="m2"/>
      <label for="m2">metade[2]</label>
    </td>
  </tr>
</table>

<div onclick="resultado()">
    Clique para visulizar a quantidade de opções 'inteiro' e a quantidade de opções 'metade' marcadas:
</div>

01.02.2018 / 13:52

Working with multiple or single databases (MySQL) For with DateTime in Razor giving out of memory exception

score 2 · Accepted Answer

If you only want to count how many half and integer inputs are selected, you can do everything at the expense of the selector.

For this you will need to include in your selector:

[type=radio] to include only the radio buttons
[value=inteiro] or [value=metade] to catch only those that have value that interests you
:checked to be selected only

Then you just know the amount of elements obtained by referring to length .

Example:

function resultado(){
  let metades = $("input[type=radio][value=metade]:checked").length;
  let inteiros = $("input[type=radio][value=inteiro]:checked").length;
  console.log("Inteiro(s) " + inteiros, "Metade(s) " + metades );
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><inputtype="radio" name="nome[]" value="inteiro"/>inteiro[]
<input type="radio" name="nome[]" value="metade"/>metade[]
<p></p>
<input type="radio" name="nome[1]" value="inteiro"/>inteiro[1] 
<input type="radio" name="nome[1]" value="metade"/>metade[1]<p></p>
<input type="radio" name="nome[2]" value="inteiro"/>inteiro[2] 
<input type="radio" name="nome[2]" value="metade"/>metade[2]
<p><span onclick="resultado()">resultado - clique.</span></p>