Foros del Web » Programando para Internet » Javascript »

Pregunta rapida sobregetElentById

Estas en el tema de Pregunta rapida sobregetElentById en el foro de Javascript en Foros del Web. Hola estoy tratando de sacra todos los check selecionados que hay en un div para luego meterlo en un arreglo. Código: var checkboxes = document.getElementById("div").checkbox; ...
  #1 (permalink)  
Antiguo 07/10/2010, 19:16
 
Fecha de Ingreso: julio-2008
Mensajes: 366
Antigüedad: 15 años, 4 meses
Puntos: 7
Pregunta rapida sobregetElentById

Hola estoy tratando de sacra todos los check selecionados que hay en un div
para luego meterlo en un arreglo.

Código:
var checkboxes = document.getElementById("div").checkbox;
 for (var x=0; x < checkboxes.length; x++)
		    {
 			  if (checkboxes[x].checked)
			    {
  					arreglo.push(checkboxes[x].value);
                }
            }
el error esta en que me dice que checkboxes is null.
osea que no esta secorriendo los check selecionados.
algun aidea
  #2 (permalink)  
Antiguo 07/10/2010, 20:16
Avatar de maycolalvarez
Colaborador
 
Fecha de Ingreso: julio-2008
Ubicación: Caracas
Mensajes: 12.120
Antigüedad: 15 años, 4 meses
Puntos: 1532
Respuesta: Pregunta rapida sobregetElentById

eso es porque no existe tal colección checkbox.

puedes usar getElementsByTagName, recorrer por el DOM, las colección elements del Form, o un framework como jQuery para extraer los checkbox de forma rápida

ejemplo jQuery:
Código Javascript:
Ver original
  1. $('#div input[type=checkbox]').each(function(index, obj) {
  2.     if(obj.checked){
  3.         arreglo.push(obj.value); // o index?
  4.     }
  5. });

NOTA: en este caso #div representa el id del DIV, no todas las capas DIV, es decir la: <div id="div">...</div>
__________________
¡Por favor!: usa el highlight para mostrar código
El que busca, encuentra...

Última edición por maycolalvarez; 07/10/2010 a las 21:06 Razón: oops! era value en vez de checked
  #3 (permalink)  
Antiguo 07/10/2010, 20:35
 
Fecha de Ingreso: julio-2008
Mensajes: 366
Antigüedad: 15 años, 4 meses
Puntos: 7
Respuesta: Pregunta rapida sobregetElentById

maycolalvares

antes que nbada gracia spor responder.
por lo menos yo no puedo meterlo en jquery ya que la funcion que revisa a los check le pasa valores a un ajax.

por el momento estoy obtenido los checados de esta forma.

Código Javascript:
Ver original
  1. var checkboxes = document.getElementById('check').checked;
  2.            for (var i=0; i<checkboxes.length; i++)
  3.             {
  4.             arreglo.push(checkboxes[i].value);
  5.                     }

pero hacerle un alert a, arreglo fuera del for. no me muestra valor alguno, se abre la ventada de aler y pero sin nada.
y si le hago un alert dentro del for, nunca se ejecuta el alert es como si no entrara en el ciclo for
  #4 (permalink)  
Antiguo 07/10/2010, 20:41
Avatar de maycolalvarez
Colaborador
 
Fecha de Ingreso: julio-2008
Ubicación: Caracas
Mensajes: 12.120
Antigüedad: 15 años, 4 meses
Puntos: 1532
Respuesta: Pregunta rapida sobregetElentById

1) usar jQuery no afecta para nada el uso o no de ajax, de hecho, jquery dispone de funciones para ajax ($.ajax, $.post, $.get, entre otras) pero puede usarse perfectamente con una función ajax tradicional

2) no puedes acceder a los valores de la variable arreglo porque está fuera de ámbito, como vez declaras implícitamente la variable al llamarla desde dentro del bloque for (cosa que IE no admite), por ende no está accesible desde fuera de dicho bloque al finalizar el ciclo, debes declararla antes de entrar a ciclo y de forma explicita, como debe hacerse:

Código Javascript:
Ver original
  1. var checkboxes = document.getElementById('check').checked; //esto solo te devolverá el primero
  2. var arreglo = new Array(); //declaración explicita
  3. for (var i=0; i<checkboxes.length; i++)
  4. {
  5.     arreglo.push(checkboxes[i].value);
  6. }

como aquello aún no funciona, porque solo devuelve el primer check, se puede usar getElementsByTagName:

Código Javascript:
Ver original
  1. //JS puro, sin jQuery ;-)
  2. var checkboxes = document.getElementById('div').getElementsByTagName('input');
  3. var arreglo = new Array(); //declaración explicita
  4. for(var i in checkboxes){
  5.     if(checkboxes[i].type == "checkbox" && checkboxes[i].checked){
  6.         arreglo.push (checkboxes[i].value);
  7.     }    
  8. }

como puedes ver jQuery simplifica las cosas, porque el método js puro hay que especificar bastante
__________________
¡Por favor!: usa el highlight para mostrar código
El que busca, encuentra...

Última edición por maycolalvarez; 07/10/2010 a las 21:05
  #5 (permalink)  
Antiguo 07/10/2010, 21:10
 
Fecha de Ingreso: julio-2008
Mensajes: 366
Antigüedad: 15 años, 4 meses
Puntos: 7
Respuesta: Pregunta rapida sobregetElentById

ok
declare el arreglo tal como me dijiste.
de echo no jala.
pero me surgen dos dudas.
1.- no se supone que en teoria la linea
Código Javascript:
Ver original
  1. var checkboxes = document.getElementById('check').checked;
deberia de jalar a todos lo que esten checked.

2.- por que si le pongo un alert.dentro del for, no muestra la pantalla(del alert).
  #6 (permalink)  
Antiguo 07/10/2010, 21:15
Avatar de maycolalvarez
Colaborador
 
Fecha de Ingreso: julio-2008
Ubicación: Caracas
Mensajes: 12.120
Antigüedad: 15 años, 4 meses
Puntos: 1532
Respuesta: Pregunta rapida sobregetElentById

a mi me funciona perfectamente.

la linea que dices, no puede devolver todos los checks, porque al final le indicas que te devuelva el checked, así que solo te devolverá true o false, según el valor del primer check:

var checkboxes = document.getElementById('check').checked

getElementById
está en singular, por lo tanto sólo devuelve un elemento, a diferencia de getElementsByTagName

deberías postear la parte en HTML para ver porque no te funciona, la mia de prueba es:

Código HTML:
Ver original
  1. <div id="div">
  2.     <input type="checkbox" id="check1" name="x1" value="1" />
  3.     <input type="checkbox" id="check2" name="x2" value="2" />
  4.     <input type="checkbox" id="check3" name="x3" value="3" />
  5. </div>
__________________
¡Por favor!: usa el highlight para mostrar código
El que busca, encuentra...

Última edición por maycolalvarez; 07/10/2010 a las 21:22
  #7 (permalink)  
Antiguo 07/10/2010, 21:25
 
Fecha de Ingreso: julio-2008
Mensajes: 366
Antigüedad: 15 años, 4 meses
Puntos: 7
Respuesta: Pregunta rapida sobregetElentById

Disculpa por mi ignorancia, o como decimos en México (por mi pendejes--> usted disculpa por la palabra).

pero no me queda.
mi re le voy amosntrar la funcion completa

Código Javascript:
Ver original
  1. function beta(dato)
  2.   {
  3.      var div=document.getElementById("txtHint").innerHTML;
  4.      if(div != "")
  5.        {
  6.  
  7.            var boxes = document.getElementById('check');
  8.            var arreglo = new Array();
  9.            //alert(checkboxes.length);
  10.            //var checkboxes = document.getElementById("txtHint").check;
  11.            for (i=0; i<boxes.length; i++)
  12.             {
  13.                 if(boxes[i].value == "checked")
  14.                   {
  15.                     arreglo.push(boxes[i].value)
  16.                     alert(boxes[i].value);
  17.                   }
  18.             }
  19.             var cadena = arreglo.toString()
  20.             var ajax = showUser(dato, cadena)
  21.        }
  22.       else
  23.        {
  24.           var cadena = "Sin valor";
  25.           var ajax = showUser(dato, cadena);
  26.        }
  27.   }

esta funcion se activa con evento onchange de un list-menu.
por si quuiere saber mas detalles mire aqui:
http://www.forosdelweb.com/f77/nesecito-ayuda-con-checkbox-848513/
  #8 (permalink)  
Antiguo 07/10/2010, 21:42
Avatar de maycolalvarez
Colaborador
 
Fecha de Ingreso: julio-2008
Ubicación: Caracas
Mensajes: 12.120
Antigüedad: 15 años, 4 meses
Puntos: 1532
Respuesta: Pregunta rapida sobregetElentById

corregí lo más que pude, prueba a ver:
Código Javascript:
Ver original
  1. function beta(dato)
  2. {
  3.     var div=document.getElementById("txtHint").innerHTML;
  4.     if(div != "")
  5.     {
  6.         //var boxes = document.getElementById('check'); //olvídate de esto!
  7.         //los checkbox son tags (input type="checkbox") NO: (checkbox type="checkbox")
  8.         var boxes = document.getElementById('txtHint').getElementsByTagName('input');
  9.         var arreglo = new Array();
  10.         //for (i=0; i<boxes.length; i++)
  11.         //es mucho mejor que la sintaxis anterior
  12.         for (var i in boxes)
  13.         {
  14.             //if(boxes[i].value == "checked") //El value NUNCA será checked, a menos que lo especifiques, de lo contrario será "On"
  15.             //DOS condiciones: que el input sea checkbox Y que esté marcado o checked
  16.             if( boxes[i].type == "checkbox" && boxes[i].checked )
  17.             {
  18.                 //hey!!! y el punto y coma, que no se te olvide
  19.                 arreglo.push(boxes[i].value);
  20.                 //boxes[i].value siempre devolverá "On" a menos que especifiques otro valor para el (input  type="checkbox" value="devuelve esto")
  21.                 alert(boxes[i].value);
  22.             }
  23.         }
  24.         var cadena = arreglo.toString();//HEY!!! sin punto y coma otra vez!
  25.         var ajax = showUser(dato, cadena);//HEY!!! sin punto y coma otra vez!
  26.     }
  27.     else
  28.     {
  29.         var cadena = "Sin valor";
  30.         var ajax = showUser(dato, cadena);
  31.     }
  32. }

te recomiendo que instales FIREBUG en FireFox, es una excelente herramienta que te permite depurar y te avisa de errores javascript

PD: no está permitido duplicar posts, en caso de que consideres que el tema debe ser movido a otro sitio, reportarlo en el post correspondiente con: e indica: favor mover a javascript
__________________
¡Por favor!: usa el highlight para mostrar código
El que busca, encuentra...

Última edición por maycolalvarez; 07/10/2010 a las 21:48
  #9 (permalink)  
Antiguo 07/10/2010, 21:54
 
Fecha de Ingreso: julio-2008
Mensajes: 366
Antigüedad: 15 años, 4 meses
Puntos: 7
Respuesta: Pregunta rapida sobregetElentById

A que cosas.
en Iexplorer no correr(al menos en el mio es 8)
y en crhome si corre.

lo unico que se ocurre es que como crhome al instalrle le quita los complemento a Ie, por eso correr. crees que sea eso
  #10 (permalink)  
Antiguo 07/10/2010, 22:03
Avatar de maycolalvarez
Colaborador
 
Fecha de Ingreso: julio-2008
Ubicación: Caracas
Mensajes: 12.120
Antigüedad: 15 años, 4 meses
Puntos: 1532
Respuesta: Pregunta rapida sobregetElentById

no creo que chrome interfiera con IE, el código es bastante genérico, funciona en FF, SF, GC, IE7 y OP, la única forma de que en IE no te corra es porque te has comido la declaración explicita de las variables (con var) y algún error de sintaxis que tengas por ahí.

bueno, cualquier otra duda, te contesto mañana (aquí son las 11:30pm), o que otro te ayude, suerte
PD: que cosas de la vida, una pregunta rápida se convirtió en toda un clase
__________________
¡Por favor!: usa el highlight para mostrar código
El que busca, encuentra...
  #11 (permalink)  
Antiguo 07/10/2010, 22:25
 
Fecha de Ingreso: julio-2008
Mensajes: 366
Antigüedad: 15 años, 4 meses
Puntos: 7
Respuesta: Pregunta rapida sobregetElentById

ok,
en mexco son las 11:20.

como ultimo:
ojala y lo puedas leer.

como puedo agradecer tu ayuda?

Etiquetas: rapida
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 11:55.