0

Como puedo guardar el id de cada checkbox seleccionado en un array?

En este pedazo de codigo estoy identificando los checkboc que estan en true, es decir que han sido seleccionados, pero requiero hacer una array con todos estos id, como puedo hacerlo?

 $("#ids:input[type='checkbox']").each(function () {
        if ($(this).attr("selected") == true) {

            var IdEstatus = {
                _idcheck: xxx,//que debo poner aqui,
            }

        }
    });

2 respuestas 2

0

Simple, lo primero que tienes que hacer es tener un array vacio, por ejemplo:

const ids = [];

Luego usando .push enviar el nuevo valor a tu array, por ejemplo:

var IdEstatus = {
     ids.push( 'El ID de tu checkbox' );
}

Cuando hagas console.log de nuevo podrás ver el Array lleno con los nuevos valores.

console.log( ids );

const ids = [];
ids.push('ID551');
console.log( ids );

0

La clave de todo está en la forma de seleccionar los elementos.

Con esto input[type=checkbox]:checked estarías seleccionado todos los checkbox chequeados, no necesitas verificación previa al interior del bucle, solamente puedes meter la propiedad (en este caso el id) dentro del array final.

Si solamente necesitas los ids, puedes hacer con map directamente, por ejemplo:

var allChecked = $('input[type=checkbox]:checked').map(function(){
      return $(this).prop('id');
    });
console.log(allChecked.get());
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<div class="row">
    <input type="checkbox" id="one" checked value="option1"> 
    <label for="one">Option1</label>
    <input  type="checkbox" id="two" value="option2"> 
    <label for="two">Option2</label>
    <input checked  type="checkbox" id="three" value="option3"> 
    <label for="three">Option3</label>
    <input type="text" value="No es checkbox" />
</div>

Si necesitas hacer otras cosas en el bloque, entonces, creas un array y metes dentro los ids, por ejemplo:

var allChecked = [];
$('input[type=checkbox]:checked').each(function(){
      /*Hacer más cosas aquí ...*/
      allChecked.push($(this).prop('id'));
});
    
console.log(allChecked);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<div class="row">
    <input type="checkbox" id="one" checked value="option1"> 
    <label for="one">Option1</label>
    <input  type="checkbox" id="two" value="option2"> 
    <label for="two">Option2</label>
    <input checked  type="checkbox" id="three" value="option3"> 
    <label for="three">Option3</label>
    <input type="text" value="No es checkbox" />
</div>


Con Javascript puro, puedes hacer algo así:

var allChecked = [...document.querySelectorAll('input[type=checkbox]:checked')].map(e => e.id); 
console.log(allChecked);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<div class="row">
    <input type="checkbox" id="one" checked value="option1"> 
    <label for="one">Option1</label>
    <input  type="checkbox" id="two" value="option2"> 
    <label for="two">Option2</label>
    <input checked  type="checkbox" id="three" value="option3"> 
    <label for="three">Option3</label>
    <input type="text" value="No es checkbox" />
</div>

La diferencia la marca el modo en que selecciones los elementos según el contexto de los mismos (el tipo, la clase, el contenedor, la posición, etc).

2
  • Agregue lo que comentaste 'allChecked.push($(this).prop('id'));' Al revisar el array, el resultado es el siguiente: "check(1208)"... Yo solo requiero el numero que es el id, sin embargo, me muestra el nombre de la variable tambien
    – cosito
    el 12 ene. 2022 a las 18:16
  • @cosito ¿ha funcionado o no? Considera poner un ejemplo mínimo de tu HTML para ver cómo están los checkbox, esto es clave para saber cómo debe ponerse el selector.
    – A. Cedano
    el 12 ene. 2022 a las 18:19

Tu Respuesta

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

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