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
    Commented el 25 may. 2018 a las 21:21
  • 1
    A eso voy, ya tengo la solución, sera un aporte. Please wait. Commented 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

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.