2

estoy tratando de setear mis campos de un formulario y me sale el siguiente error

mi codigo:

$('#limpiar').on("click", function(e) {
// document.getElementById('tipo_operacion').val = "";

document.querySelector('input[type=radio][name=documento]:checked').checked = false;
document.querySelector('input[type=radio][name=serv_locacion]:checked').checked = false;
document.querySelector('input[type=radio][name=docn_siafumento]:checked').checked = false;
document.querySelector('input[type=radio][name=v]:checked').checked = false;
});

El error es el siguiente

introducir la descripción de la imagen aquí

Como podria realizar el limpiar los campos si no marco algunos inputs

1
  • Lo que quieres es que con un check "limpiar" desmarque a los demás? Commented el 20 feb. 2023 a las 18:42

2 respuestas 2

1

Por lo que entendí quieres desmarcar los input radio seleccionados y se puede hacer de manera mas dinámica con querySelectorAll.

//ACCEDEMOS AL INPUT CON CLASE CLEAN Y ESCUCHAMOS EL EVENTO CLICK
document.getElementById("clean").addEventListener('change', function(){
//VERIFICAMOS QUE EL ELEMENTO ESTE CHECKED (CLEAN)
if(this.checked) {
  //OBTENEMOS TODOS LOS INPUT RADIO Y LOS GUARDAMOS EN UNA VARIABLE
  var options = document.querySelectorAll('.option');
  //RECORREMOS LOS ELEMENTOS
  options.forEach(function(element){
        element.checked = false; 
   })
} 
})
<input type="checkbox" id="clean">Limpiar</input><br><br>
<input type="radio" class="option">radio 1</input> 
<input type="radio" class="option">radio 2</input> 
<input type="radio" class="option">radio 3</input> 
<input type="radio" class="option">radio 4</input>  

Dime si es lo que buscabas.

4
  • +1, pero ojo, la idea es que eso suceda solo al marcar el checkbox y no cuando le quitamos el check, fíjate que cuando el checkbox está marcado, seleccionamos los buttons y desenmarcamos el checkbox, los radio buttons igual se desenmarcan, y debería ocurrir solo al marcar el checkbox. Creo que esto lo solucionarías cambiando el listener click por change. Commented el 20 feb. 2023 a las 20:03
  • Cierto, la verdad no lo aplique ya que no menciona si al desmarcar el check quiere que se marquen todos o que acción quiere realizar, esperaba a que viera la respuesta y diera mas contexto, quedo al pendiente para modificarla, gracias @Cris223511.dev Commented el 20 feb. 2023 a las 20:12
  • Perdón, veo que sigue sin funcionar :s, dentro de tu listener (justo debajo de var options...) pon if (this.checked) {...} y dentro de las llaves pon todo tu foreach, ahí ya creo que sí jeje... con eso validas que el checkbox esté seleccionado :-) Commented el 20 feb. 2023 a las 20:50
  • 1
    Listo, cambio la lógica. Commented el 20 feb. 2023 a las 21:00
0

Puedo notar que usas jQuery.

Una solución simple es agregar una clase en común para los input que quieras desmarcar al hacer click en el botón con id limpiar.

Luego con jQuery, en el evento click del botón, seteas la propiedad checked a false... y eso es todo.

$('#limpiar').on('click', function() {
  $('.radio-button').prop('checked', false);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button id="limpiar">Limpiar radio buttons</button>
<input type="radio" name="documento" class="radio-button" />
<input type="radio" name="serv_locacion" class="radio-button" />
<input type="radio" name="docn_siafumento" class="radio-button" />
<input type="radio" name="v" class="radio-button" />

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.