Ayuda con Suma de radiobutton

andoencombi · #1 (**permalink**) 18/02/2011, 12:28

hola Foro que tal espero y me puedan ayudar en esta duda que me surgio:

tengo el siguiente codigo:

Código PHP:

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Documento sin título</title>

</head>

 
<body>

<form id="form1" name="form1" method="post" action="">

  <table width="600">

    <tr>

      <td><p>

        <label>

          <input type="radio" name="RadioGroup1" value="opción" id="RadioGroup1_0" />

          Opción</label>

        <br />

        <label>

          <input type="radio" name="RadioGroup1" value="opción" id="RadioGroup1_1" />

          Opción</label>

        <br />

        <label>

          <input type="radio" name="RadioGroup1" value="opción" id="RadioGroup1_2" />

          Opción</label>

        <br />

        <label>

          <input type="radio" name="RadioGroup1" value="opción" id="RadioGroup1_3" />

          Opción</label>

        <br />

        <label>

          <input type="radio" name="RadioGroup1" value="opción" id="RadioGroup1_4" />

          Opción</label>

        <br />

      </p></td>

      <td><p>

        <label>

          <input type="radio" name="RadioGroup2" value="opción" id="RadioGroup2_0" />

          Opción</label>

        <br />

        <label>

          <input type="radio" name="RadioGroup2" value="opción" id="RadioGroup2_1" />

          Opción</label>

        <br />

        <label>

          <input type="radio" name="RadioGroup2" value="opción" id="RadioGroup2_2" />

          Opción</label>

        <br />

        <label>

          <input type="radio" name="RadioGroup2" value="opción" id="RadioGroup2_3" />

          Opción</label>

        <br />

        <label>

          <input type="radio" name="RadioGroup2" value="opción" id="RadioGroup2_4" />

          Opción</label>

        <br />

      </p></td>

    </tr>

    <tr>

      <td colspan="2"><input type="text" name="resultado" id="resultado" disabled="disabled" value="0" /></td>

    </tr>

  </table>

</form>

</body>

</html>

lo que quiero es que cuando seleccione una opcion del primer grupo de radiobutton aparezca su valor en el campo de texto y que si selecciono una opcion del segundo grupo de radiobutton lo sume con lo que ya esta en ese campo de texto.

Claro que los valores deben de ser numericos para que los pueda sumar.

omarMusic · #2 (**permalink**) 18/02/2011, 16:53

mmm, parece tarea de instituto, pero

Javascript:

var suma = 0;
function agregar(radio) {
suma = parseInt(radio.value);
document.getElementById("resultado").value = radio.value;
}
function sumar(radio) {
document.getElementById("resultado").value = eval(suma + parseInt(radio.value));
}

En el primer grupo de radiobutton

<input type="radio" name="RadioGroup1" value="1" onclick="agregar(this);" id="RadioGroup1_0" />

En el segundo grupo de radiobutton

<input type="radio" name="RadioGroup2" value="1" onclick="sumar(this);" id="RadioGroup2_0" />

Saludos!

andoencombi · #3 (**permalink**) 18/02/2011, 17:14

que tal como han estado, gracias omarMusic casi funciona bien solo que tiene un pequeño error, te explico lo que pasa:

cuando elijo un valor del primer grupo y despues un valor del segundo grupo de radiobutton todo bien

pero si vuelvo a elegir un valor del primer grupo de radiobutton toma solo el valor del primer grupo de radiobutton y ya no suma el valor del segundo grupo de radiobutton.

Código PHP:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin t&#237;tulo</title>
<script>
var suma = 0;
function agregar(radio) {
suma = parseInt(radio.value);
document.getElementById("resultado").value = radio.value;
}
function sumar(radio) {
document.getElementById("resultado").value = eval(suma + parseInt(radio.value));
}
</script>
 
</head>
 
<body>
<form id="form1" name="form1" method="post" action="">
  <table width="600">
    <tr>
      <td><p>
        <label>
          <input type="radio" name="RadioGroup1" value="1" onclick="agregar(this);" id="RadioGroup1_0" />
          Opci&#243;n</label>
        <br />
        <label>
          <input type="radio" name="RadioGroup1" value="2" onclick="agregar(this);" id="RadioGroup1_1" />
          Opci&#243;n</label>
        <br />
        <label>
          <input type="radio" name="RadioGroup1" value="3" onclick="agregar(this);" id="RadioGroup1_2" />
          Opci&#243;n</label>
        <br />
        <label>
          <input type="radio" name="RadioGroup1" value="4" onclick="agregar(this);" id="RadioGroup1_3" />
          Opci&#243;n</label>
        <br />
        <label>
          <input type="radio" name="RadioGroup1" value="5" onclick="agregar(this);" id="RadioGroup1_4" />
          Opci&#243;n</label>
        <br />
      </p></td>
      <td><p>
        <label>
          <input type="radio" name="RadioGroup2" value="6" onclick="sumar(this);" id="RadioGroup2_0" />
          Opci&#243;n</label>
        <br />
        <label>
          <input type="radio" name="RadioGroup2" value="7" onclick="sumar(this);" id="RadioGroup2_1" />
          Opci&#243;n</label>
        <br />
        <label>
          <input type="radio" name="RadioGroup2" value="8" onclick="sumar(this);" id="RadioGroup2_2" />
          Opci&#243;n</label>
        <br />
        <label>
          <input type="radio" name="RadioGroup2" value="9" onclick="sumar(this);" id="RadioGroup2_3" />
          Opci&#243;n</label>
        <br />
        <label>
          <input type="radio" name="RadioGroup2" value="10" onclick="sumar(this);" id="RadioGroup2_4" />
          Opci&#243;n</label>
        <br />
      </p></td>
    </tr>
    <tr>
      <td colspan="2"><input type="text" name="resultado" id="resultado" disabled="disabled" value="0" /></td>
    </tr>
  </table>
</form>
</body>
</html>

omarMusic · #4 (**permalink**) 19/02/2011, 09:53

Tadavia mas sencillo

var suma = 0;
function sumar(radio) {
suma += parseInt(radio.value);
document.getElementById("resultado").value = suma;
}

y en todos los radiobutton la función sumar()

<input type="radio" value="x" onclick="sumar(this);" />

andoencombi · #5 (**permalink**) 19/02/2011, 16:17

que tal omarMusic casi casi es lo que se requiere que haga el script, solo que si elijo dos veces una opcion del primer radiobutton lo suma otra vez y nadamas lo debe de sumar una vez ejemplo:

radiobutton 1

opcion a valor=1
opcion b valor=2
opcion c valor=3
opcion d valor=4

radiobutton 2

opcion e valor=5
opcion f valor=6
opcion g valor=7
opcion h valor=8

y si elijo opcion a y opcion e =6 y si cambio la opcion a por la b el resultado es =8 cuando deberia de ser =7 (b+e) y no lo que ya esta en el resultado mas la nueva opcion

porfavor indicame si me explique.

es decir solo debe de ser un valor del primer grupo de radiobuttons + una sola opcion del segundo grupo de radiobuttons con la facilidad de cambiar el valor de cualquier grupo de radiobuttons

omarMusic · #6 (**permalink**) 25/02/2011, 11:49

Disculpa la tardanza pero aca esta por fin

Código Javascript:

Ver originalvar valor1 = 0;
var valor2 = 0;
function sumar(radio) {
    var valor = parseInt(radio.value);
    if (radio.name == "RadioGroup1")
        valor1 = valor;
    else    
        valor2 = valor;
    document.getElementById("resultado").value = valor1 + valor2;
}

Saludos!

iti_bagr · #7 (**permalink**) 13/06/2011, 08:12

Hola soy nueva en esto, podrian ayudarme con la suma de radio button pero en php lo que pasa q no se si agregar alguna funcion o algo asi en el formulario lo q pasa q tengo algo como esto pero no funciona. No se si al momento de agregar lo que es el codigo php, como se manden llamar los campos que se deben sumar por medio del nombre en este caso name=opcion1, o como? Ojala pudieran ayudarme plis!!!!

<html>
<head>
<title>Documento</title>
</head>
<body>
<form name="Form1" method="post">
<p> Elige puntaje para Fisica<p>
<label>
<input type="radio" name="opcion1" value="0">
0</label>
<br>
<label>
<input type="radio" name="opcion1" value="2">
2</label>
<br>
<p> Elige puntaje para matematicas
<p>
<label>
<input type="radio" name="opcion2" value="6">
6</label>
<br>
<label>
<input type="radio" name="opcion2" value="8">
8</label>
<br>
<input type="submit" name="enviar" onClick="this">
<?php
if (onClick==['submit'] $_GET['enviar']=="submit")
{
<input type="radio" name="opcion1" value="0">
<input type="radio" name="opcion2" value="2">
var $opcion1=0;
var $opcion2=2;
$suma= opcion1+opcion2;
echo("La suma es $suma");
}
?>
</form>

</body>
</html>

mikepianist · #8 (**permalink**) 12/01/2012, 15:29

Bueno, por fin! Tomando tus códigos y modificándolo para lo que lo necesitaba lo logré! Estoy muy agradecido, acá le dejo el siguiente aporte:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
<script>
var valor1 = 0;
var valor2 = 0;
function sumar(radio) {
* * var valor = parseInt(radio.value);
* * if (radio.name == "RadioGroup1")
* * * * valor1 = valor;
* * else* *
* * * * valor2 = valor;
* * document.getElementById("resultado").value = valor1 + valor2;
}

</script>
*
</head>
*
<body>
<form id="form1" name="form1" method="post" action="">
* <table width="600">
* * <tr>
* * * <td><p>
* * * * <label>
* * * * * <input type="radio" name="RadioGroup1" value="1" onclick="sumar(this);" id="RadioGroup1_0" />
* * * * * Opción</label>
* * * * <br />
* * * * <label>
* * * * * <input type="radio" name="RadioGroup1" value="2" onclick="sumar(this);" id="RadioGroup1_1" />
* * * * * Opción</label>
* * * * <br />
* * * * <label>
* * * * * <input type="radio" name="RadioGroup1" value="3" onclick="sumar(this);" id="RadioGroup1_2" />
* * * * * Opción</label>
* * * * <br />
* * * * <label>
* * * * * <input type="radio" name="RadioGroup1" value="4" onclick="sumar(this);" id="RadioGroup1_3" />
* * * * * Opción</label>
* * * * <br />
* * * * <label>
* * * * * <input type="radio" name="RadioGroup1" value="5" onclick="sumar(this);" id="RadioGroup1_4" />
* * * * * Opción</label>
* * * * <br />
* * * </p></td>
* * * <td><p>
* * * * <label>
* * * * * <input type="radio" name="RadioGroup2" value="1" onclick="sumar(this);" id="RadioGroup2_0" />
* * * * * Opción</label>
* * * * <br />
* * * * <label>
* * * * * <input type="radio" name="RadioGroup2" value="2" onclick="sumar(this);" id="RadioGroup2_1" />
* * * * * Opción</label>
* * * * <br />
* * * * <label>
* * * * * <input type="radio" name="RadioGroup2" value="3" onclick="sumar(this);" id="RadioGroup2_2" />
* * * * * Opción</label>
* * * * <br />
* * * * <label>
* * * * * <input type="radio" name="RadioGroup2" value="4" onclick="sumar(this);" id="RadioGroup2_3" />
* * * * * Opción</label>
* * * * <br />
* * * * <label>
* * * * * <input type="radio" name="RadioGroup2" value="5" onclick="sumar(this);" id="RadioGroup2_4" />
* * * * * Opción</label>
* * * * <br />
* * * </p></td>
* * </tr>
* * <tr>
* * * <td colspan="2"><input type="text" name="resultado" id="resultado" disabled="disabled" value="0" /></td>
* * </tr>
* </table>
</form>
</body>
</html>

andoencombi · #9 (**permalink**) 12/01/2012, 17:17

Buen aporte Gracias!!!!