Sumar Valores de formulario...

[andrewp]

Hola...

Mi pregunta se relaciona con el siguiente cuadro de trabajo:

Un formulario tiene un número 'n' de campos a través del cuál el usuario debe submitar uno o más valores que al sumarlos sean iguales a un valor 'x'. Me explico... El valor "x=12800" y el usuario dispone de "n=15" campos para distribuír el valor 'x' en partes no necesariamente iguales. Igual, el usuario puede dejar algunos campos sin valor, pero al final la suma de los campos (en mi ejemplo de los 15 campos) debe ser exactamente igual a 'x' (en mi ejemplo 12800).

La idea es que si la suma de los campos es igual al valor 'x', el botón de 'validar' del formulario se active, de lo contrario, deberá permanecer inactivo.

Mi pregunta, pues, es de qué manera puedo validar la suma de un número variable de campos igualadas a un valor que tengo en una variable de PHP?

Código HTML:

<script language="javascript">
function desactivar()
{
document.formulario.SUMAcampo++i.value!=<?php echo $valor_x; ?>;
document.formulario.submit.disabled = true;
}
function activar()
{
document.formulario.SUMAcampo++i.value==<?php echo $valor_x; ?>;
document.formulario.submit.disabled = false;
}
</script> 

[AlvaroG]

No parece ser demasiado complicado, aunque yo guardaría el valor total en una variable.
Luego, tendría una función suma() llamada en el evento blur de cada campo, que valide la suma. Podés hacer que tus nombres de campos faciliten las cosas, pero por ejemplo:

Código Javascript:

var suma_total = <?php echo $valor_x; ?>;
var n = 15;
 
function suma() {
    var suma_parcial = 0;
    for (var i  = 1; i < n; i++) {
        suma_parcial += document.getElementById('campo' + i);
    }
    if (suma_parcial === suma_total) {
        activar_submit();
    }
}
 

Faltaría hacer una comprobación para los campos vacíos, pero esa es la idea.


Saludos.

[andrewp]

Hey Alvaro...

Muchas gracias por tu aporte... Sin duda lo intentaré acoplar a mi necesidad. Para la pregunta que me haces sobre si cada campo tiene un nombre, la respuesta es "si", cada uno tiene un nombre que genero en PHP de modo 'n%' para lo que el porcentage (%) representa un nombre único para "n" campos generados. Así, si el usuario selecciona veinte campos, cada uno se llamará desde n1, n2, n3, n4... hasta n20.

Esto cambia en algo el código que me has propuesto?

[AlvaroG]

No, no debería cambiar nada excepto la línea 7 ('campo' pasaría a ser 'n')

[andrewp]

Gracias Alvaro...

Ya he acomodado tu sugerencia a un script un pelín más complicado usando PHP, lo he depurado y parece que no reporta ningún problema, salvo que no sé muy bien cómo puedo activar la función, o mejor dicho, bajo qué evento en ele formulario para que se ejecute.

He intentado:

<input=text.... onfocus="suma();">
<input=text.... onafterupdate="suma();">
<input=text.... onchange="suma();">

pero no me activa el susodicho botón. Me podrías echar una mano diciéndome cómo puedo llamar la función "suma" en el formulario?

Mil gracias!

[AlvaroG]

Pues depende de cómo esté tu código ahora mismo, en principio yo lo pondría en blur (para que se actualice al salir del campo) pero igual debería funcionar en change

[andrewp]

Gracias de nuevo...

En resumidas cuentas, el código de JS lo tengo así:

Código PHP:

 <script language="javascript"> 
    var sumtotal = <?php echo $total ?>; 
    var ntotal = <?php echo $tot_count; ?>; 
function suma() { 
    var sumpartial = 0; 
    for (var i = 1; i <     ntotal; i++) { 
        sumpartial += document.getElementByID( 'n' + i ); 
    } 
    if (sumpartial === sumtotal) { 
        document.myform.submitboton.disabled = false; 
    } 
} 
</script>  

Luego, en el formulario el campo del tipo 'type=text' contienen onblur="suma();"... Aunque me sigue sin funcionar... Y si lo pongo en el <form ... onSubmit="summa();"> tampoco me va.... Alguna idea de dónde me estoy quedando?

Mil gracias de nuevo.

[AlvaroG]

Mi código original tenía un fallo: La suma no debe ser

Código Javascript:

sumapartial += document.getElementById('n' + i);
 

sino

Código Javascript:

sumapartial += document.getElementById('n' + i).value;
 

A ver si anda así