0

En ocasiones nos piden en un formulario de HTML, listar en 1 o n checkboxes características de un elemento. Ejemplo:

Seleccione 1 o n áreas de interés para su solicitud laboral.

Entonces debemos obtener el ID de C/U de las áreas de interés que seleccione y validar si al menos 1 checkbox ha sido seleccionado.

¿Como lo hago?

2
  • Deberias de intentarlo tu primero y poner el codigo de lo que has intentado.
    – alanfcm
    el 25 may. 2018 a las 21:21
  • 1
    A eso voy, ya tengo la solución, sera un aporte. Please wait. el 25 may. 2018 a las 21:22

2 respuestas 2

1

Entonces para resolver este problema hice lo siguiente:

Estos checkboxes los listo de manera dinámica. Todo lo obtengo directamente desde la base de datos.

En mi formulario tengo:

<div class="w-row">
   <% for (int i = 0; i < areaInteresModel.length; i++) {
      CatAreaInteresModel areaInteres = CatAreaInteresModel[i];
   %> 
   <div class="w-col w-col-3">
        <div class="w-form">
             <input type="checkbox" id="<%=areaInteres.getcAreaInteresId()%>" data-name="checkbox" name="checkbox"  value="<%=areaInteres.getcAreaInteresId()%>" > <%=areaInteres.getcAreaInteresNombre()%>                                     
        </div>
   </div>
   <%}%>

Y en Javascript

var check_interes = form_t.checkbox_t; //Array que contiene los checkbox
    var cont_t = 0; //Variable que lleva la cuenta de los checkbox pulsados    
    for (var x = 0; x < check_interes.length; x++) {
        if (check_interes[x].checked) {
            cont_t = cont_t + 1;
        }
    }

if (cont_t == 0) {
    //SINO HA SELECCIONADO
    alert("ERROR");
    return false;
} else if (cont_t > 5) {
    //SINO HA SELECCIONADO MAS DE (5 o N) OPCIONES DISPONIBLES.
    alert("ERROR");
    return false;
} 


var interes = document.forms[2];
var area_interes = "";
var i;
for (i = 0; i < interes.length; i++) {
    if (interes[i].checked) {
        //OBTENEMOS UN STRING CON TODOS LOS ID DE NUESTRO CHECKBOX
        area_interes = area_interes + interes[i].value + ",";
    }
}

Espero les sirva, les ayude y espero ser breve y conciso con mi aporte. De no ser así, sugiere una mejor solución, saludos!

1

Esto podría servir

//this es el formulario
let checked = this.querySelectorAll('input[type=checkbox]:checked');
if (checked.length == 0) {
    //SINO HA SELECCIONADO
    alert("ERROR");
    return false;
} else if (checked.length > 5) {
    //SINO HA SELECCIONADO MAS DE (5 o N) OPCIONES DISPONIBLES.
    alert("ERROR");
    return false;
} 

let area_interes = "";
for (let i = 0, length = checked.length; i < length; i++) {
    area_interes += checked[i].value + ",";             
}

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

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