0

Imagen de muestra

Hola, estoy trabajando en un formulario y me dicen que necesitan agregar cinco checkboxs y cinco inputs, de modo que si selecciono el primer checkbox el valor del primer input sea de 100 pero si selecciono el segundo checkbox el valor del segundo input sea de 100, sin embargo si selecciono el primer checkbox y el segundo entonces el valor del primer y segundo input sea de 50 para ambos sumar 100 y asi sucesivamente, se que tengo que usar condicionales y agregar id a cada checkbox e input para detectarlos, y aunque se como hacerlo en la teoria no logro hacerlo funcionar en la practica, se como cambiar el valor del input segun el checkbox pero no se como ingresarlo dentro de condicionales, estoy usando el evento change para detectar cuando cambia el estado del checkbox

jQuery("#choice_6_11_1").on( 'change', function() {
            if( jQuery(this).is(':checked') ) {
                jQuery('#input_6_17').val("100")
            } else {
                jQuery('#input_6_17').val("0")
            }
        });
1
  • Y, si selecciona 3, 100 no es divisible por 3? qué debes elegir 33, 33 y 34? comenta a tu profesor que existe el mínimo común múltiplo de (1,2,3,4,5) = 60 y que le ponga un cero adicional si desea usar centenas para que las cifras cacen.
    – quevedo
    Commented el 11 sept. 2020 a las 21:49

1 respuesta 1

1

Se me ocurrió algo así!

Puedes agregar todos los checks e inputs que necesites, solo asegurate que el input tenga el id del check.

Saludos!

//Obtenemos 2 arreglos de inputs
const checks = [...document.querySelectorAll('#checks input')]
const inputs =  [...document.querySelectorAll('#inputs input')]

//Seteamos la función "changeCheck" en el envento change de todos los checks
checks.forEach(check => check.addEventListener('change', e => changeCheck(e)))

const changeCheck = e => {
  const check = e.target
  const gValue = document.getElementById('globalValue').value
  
  if(gValue <= 0) return
  
  //Iteramos sobre todos los checks, si esta seleccionado devolvemos 1 sino 0.
  //Después sumamos. Ejemplo: 1 0 1 ---> 1 + 0 + 1 = 2
  const checkeds = checks.map(r => r.checked ? 1 : 0).reduce((x, j) => x + j)
  
  //Dividimos el valor global entre los checks seleccionados
  const newValue = gValue / checkeds
  
  //Iteramos sobre cada input
  inputs.forEach(input => {
  
    //Obtenenemos el check padre de acuerdo al atributo data-parent
    const parent = document.getElementById(input.dataset.parent)
    
    //Si el padre está seleccionado, seteamos el valor, sino, dejamos vacío
    if(parent.checked)
      input.value = newValue
    else
      input.value = ""
  })
}
Inserte el valor a dividir:
<input type="number" id="globalValue">
<hr>
<div id="checks">
  <input id="check1" type="checkbox">
  <input id="check2" type="checkbox">
  <input id="check3" type="checkbox">
  <input id="check4" type="checkbox">
  <input id="check5" type="checkbox">
</div>
<div id="inputs">
  <input data-parent="check1"/>
  <input data-parent="check2"/>
  <input data-parent="check3"/>
  <input data-parent="check4"/>
  <input data-parent="check5"/>
</div>

2
  • Hola, muchas gracias por tu comentario, es justo lo que necesito. Commented el 12 sept. 2020 a las 18:04
  • De nada, márcala como aceptada, jaja. Saludos Commented el 12 sept. 2020 a las 19:17

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.