How do I add only the options A and I display the total and so on (are 4 options)

Question

How do I add only the options A and I display the total and so on (are 4 options)

Navigation

#1 by (0 votes)

0

<html>
<h1>TEST DE PERSONALIDAD</h1>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script>


function Suma(formulario){
totalA=0
totalB=0;

nombre="";

for(i=0;i<formulario.elements.length;i++){
    if(formulario.elements[i].type=="radio" && nombre!=formulario.elements[i].name ){
        nombre=formulario.elements[i].name;
        grupo=document.getElementsByName(nombre);
        for(j=0;j<grupo.length;j++){
            if(grupo[j].checked){
              ((totalA+=parseInt(grupo[j].value)))&& 
(totalB+=parseInt(grupo[j].value));
            }

        }
    }else if (formulario.elements[i].type=="checkbox"){
        if(formulario.elements[i].checked){
                totalA+=parseInt(formulario.elements[i].value);




        }
    }
}



    document.form1.totalA.value = totalA;
    document.form2.totalB.value = totalB;

   
    
 
}

</script>


</head>
 
<body>
<form method="post" name="form1">
    <p>
<P>1 &nbsp;&nbsp;
Animado <input name="grupo_radio" id="radio_2" onclick="Suma(this.form)" type="radio" value= "1" />
Aventurero <input name="grupo_radio" id="radio_1" onclick="Suma(this.form)"type="radio" value="1"/>
Analítico <input name="grupo_radio" id="radio_3" onclick="Suma(this.form)"type="radio" value="1"/>
Adaptable <input name="grupo_radio" id="radio_4" onclick="Suma(this.form)"type="radio" value="1"/>
    <p>
<P>2 &nbsp;&nbsp;
Juguetón <input name="grupo_radio2" id="radio_2" onclick="Suma(this.form)" type="radio" value="1"/>
Persuasivo <input name="grupo_radio2" id="radio_1" onclick="Suma(this.form)"type="radio" value="1" "/>
Persistente <input name="grupo_radio2" id="radio_3" onclick="Suma(this.form)"type="radio" value="1"/>
Cómodo <input name="grupo_radio2" id="radio_4" onclick="Suma(this.form)"type="radio" value="1"/>
        &nbsp;</p>
    <p>
        total A<input name="totalA" type="text" value="0"  />
    
</form>

<form method="post" name="form2">

 <p>
total B<input name="totalB" type="text" value="0" />
</p>

</body>
</html>

I'm new to this and I'm doing this little code, I want to let me just select one of the 4 options per row and in the end I count how many A, B, C or D I have in total, I need help. Here I leave the code

PERSONALITY TEST

function Sum (form) { totalA = 0 totalB = 0; name=""; for (i = 0; i

1 Animated Adventurous Analytical Adaptable

2 Playful Persuasive Persistent Comfortable

total A

total B

java html

asked by Andres Alvarez 28.03.2018 в 19:19

source

1 answer

Fatal error: Using $ this when not in object context in startActivityForResult does not work

score 0 · Accepted Answer

You can do it in the following way if you can use Jquery:

$(document).ready(function(){
  $("input[type='radio']").change(function(){
    var totalA = $(".radio_a:checked").length;
    $(".totalA").find("span").text(totalA);
    
    var totalB = $(".radio_b:checked").length;
    $(".totalB").find("span").text(totalB);
    
    var totalC = $(".radio_c:checked").length;
    $(".totalC").find("span").text(totalC);
    
    var totalD = $(".radio_d:checked").length;
    $(".totalD").find("span").text(totalD);
  })
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<label>opcion A</label>
<input name="grupo_radio" class="radio_a"  type="radio" value="A" />
<label>opcion B</label>
<input name="grupo_radio" class="radio_b"  type="radio" value="B" />
<label>opcion C</label>
<input name="grupo_radio" class="radio_c"  type="radio" value="C" />
<label>opcion D</label>
<input name="grupo_radio" class="radio_d"  type="radio" value="D" />
<br>
<label>opcion A</label>
<input name="grupo_radio2" class="radio_a"  type="radio" value= "A" />
<label>opcion B</label>
<input name="grupo_radio2" class="radio_b"  type="radio" value= "B" />
<label>opcion C</label>
<input name="grupo_radio2" class="radio_c"  type="radio" value= "C" />
<label>opcion D</label>
<input name="grupo_radio2" class="radio_d"  type="radio" value= "D" />
<br>
<label>opcion A</label>
<input name="grupo_radio3" class="radio_a"  type="radio" value= "A" />
<label>opcion B</label>
<input name="grupo_radio3" class="radio_b"  type="radio" value= "B" />
<label>opcion C</label>
<input name="grupo_radio3" class="radio_c"  type="radio" value= "C" />
<label>opcion D</label>
<input name="grupo_radio3" class="radio_d"  type="radio" value= "D" />
<br>
<div class="totalA">Total A: <span>0</span></div>
<div class="totalB">Total B: <span>0</span></div>
<div class="totalC">Total C: <span>0</span></div>
<div class="totalD">Total D: <span>0</span></div>