Foros del Web » Programando para Internet » Javascript » Frameworks JS »

getElementById y ajax :S

Estas en el tema de getElementById y ajax :S en el foro de Frameworks JS en Foros del Web. Hola, soy "nuevo" en el foro (no realmente nuevo, solo que no escribo aqui desde hace siglos) y soy nuevo de verdad en javascript, asi ...
  #1 (permalink)  
Antiguo 26/07/2007, 02:44
 
Fecha de Ingreso: septiembre-2003
Ubicación: Pirexia
Mensajes: 150
Antigüedad: 21 años, 3 meses
Puntos: 1
getElementById y ajax :S

Hola, soy "nuevo" en el foro (no realmente nuevo, solo que no escribo aqui desde hace siglos) y soy nuevo de verdad en javascript, asi que no se practicamente nada.

Tengo problemas al cargar contenido asincronamente con ajax, porque tengo una funcion que (dentro de un window.addEvent('domready')) utiliza algunos elementos de mi codigo html usando document.getElementById, pero, luego de cargar algunos datos con ajax en la pagina, tambien necesito acceder a ellos con getElementById, pero no puedo porque todo esto esta dentro de el window.addEvent('domready') y me imagino que eso quiere decir, que todo lo que se ejecuta dentro de el, forma parte del dom inicial con el que se cargo la pagina inicialmente, pero luego de actualizarla asincronamente, el dom no cambia, y entonces, para mi codigo javascript, los elementos que cargo con ajax son invisibles y no los puedo alcanzar con getElementById.

Alguien sabe como puedo solucionar esto? espero no haber sido muy confuso :S yo no estoy muy claro en lo que estoy diciendo porque de verdad no conozco mucho.
Espero que me puedan ayudar, gracias!
(sin acentos)
__________________
In a world without walls, who needs Windows?
  #2 (permalink)  
Antiguo 27/07/2007, 18:52
Avatar de MaBoRaK  
Fecha de Ingreso: abril-2003
Ubicación: La Paz - Bolivia
Mensajes: 2.003
Antigüedad: 21 años, 7 meses
Puntos: 35
Re: getElementById y ajax :S

loading.........


Mientras no borres los elementos dom puedes acceder tranquilamente con document.getElementById("bla");


connection closed.
__________________

Maborak Technologies
  #3 (permalink)  
Antiguo 28/07/2007, 20:16
Avatar de stock  
Fecha de Ingreso: junio-2004
Ubicación: Monterrey NL
Mensajes: 2.390
Antigüedad: 20 años, 5 meses
Puntos: 53
Re: getElementById y ajax :S

mira, la instruccion window.addEvent('domready') me indica que estas utilizando mootools, verdad? ahora, esta funcion permite ejecutar codigo inmediatamente cuando el DOM esta listo, los nodos que le agregues al DOM estaran visibles hasta que tu los borres, y puedes accesarlos con la funcion dolar $('bla') o bien con el document.getElementById('bla').

have funnnnnnnn
  #4 (permalink)  
Antiguo 28/07/2007, 20:57
 
Fecha de Ingreso: septiembre-2003
Ubicación: Pirexia
Mensajes: 150
Antigüedad: 21 años, 3 meses
Puntos: 1
Re: getElementById y ajax :S

Cita:
Iniciado por stock Ver Mensaje
mira, la instruccion window.addEvent('domready') me indica que estas utilizando mootools, verdad? ahora, esta funcion permite ejecutar codigo inmediatamente cuando el DOM esta listo, los nodos que le agregues al DOM estaran visibles hasta que tu los borres, y puedes accesarlos con la funcion dolar $('bla') o bien con el document.getElementById('bla').

have funnnnnnnn
Hola, si, estoy usando mootools, y eso que me dijiste es lo ke estoy haciendo, pero tengo un problema distinto, kiza no me explique bien antes, voy a hacerlo de forma mas detallada ahora:


El codigo es medio largo y tiene muchas cosas ke no son utiles, asi ke lo voy a colocar medio resumido, Ademas estoy trabajando con mootools (es la unica libreria ke conozco, asi que no sabre como hacer comparaciones con prototype, jquery o cualquier otra :S)

Aqui va el codigo:
Código:
window.addEvent('domready', function() {
	var list = $$('ul#listaUsuarios li');
	var msol = new Fx.Slide('mostrarSolicitudes').hide();
	var advt = new Fx.Slide('advForm').hide();
	/*
	 * Primero defino lo que va a hacer cada uno de los li de la lista de usuarios
	 */
	list.each(function(element) {
				
		var fx = new Fx.Styles(element, {duration:100, wait:false});
		
      //
      // ESTE ES EL UNICO EVENTO IMPORTANTE, LOS OTROS DOS SON DECORACION
		element.addEvent('click', function(){
			// Pongo el mensaje de espera en userProfile.
			$('userProfile').innerHTML="<div class=\"userCargador\"><img src=\"/sitemedia/images/icons/loader2.gif\" title=\"Cargando\"><br />Cargando...</div>"
			// Cierro MOSTRAR SOLICIUTDES
			msol.hide();
			
                   // Aqui van otras cosas de diseno que no vale la pena copiar
                   // ...
		
			// Seteo la url a pedir la informacion
			url = "/usuarios/"+carnet+"/";
			
			// Hago la peticion para recargar userProfile
			new Ajax(url, {       // ESTO ESTA HECHO CON LA CLASE AJAX DE MOOTOOLS.
				method: 'post',  /// PERO YA PROBE HACIENDOLO SIN ESTA CLASE, E IGUAL SIGO CON EL PROBLEMA
				update: $('userProfile'),
			}).request();
		
                    // FUNCION QUE SE ENCARGA DE PONER DATOS QUE NO TIENEN QUE VER CON EL PROBLEMA
			setearDatos(carnet);
		});
		
		element.addEvent('mouseenter', function(){
			// ...
		});
		
		element.addEvent('mouseleave', function(){
			// ...
		});
	});


	/*
	 * Mostrar Solicitudes
	 */
	$('toggleMe').addEvent('click', function(e) {
		e = new Event(e).stop();
		msol.toggle();
	});

	/*
	 * Advertir
	 */
	 $('advertir').addEvent('click', function(e) {
	 	e = new Event(e).stop();
		advt.toogle();
	 });
});
Ok, ahora explico un poco esto...
En mi html tengo un ul#listaUsuarios con una lista de usuarios. y tambien tengo un div#userProfile donde se van a cargar asincronamente los datos de el usuario que sea cargado en la lista. Inicialmente este div#userProfile se encuentra vacio, con esto quiero decir, al momento de cargar la pagina.

Luego lo voy a actualizar con la informacion que obtengo desde la url "/usuarios/"+carnet+"/", esta url me devuelve algo mas o menos asi:

Código:
<h2>Daniel Barreto</h2>
		<hr />
		<div class="advAmarillo">
			<p>
				<a href="#1" id="advertir" name="Advertir">(0) Advertir</a><br />
				<a href="#1" id="bannear" name="Bannear">Bannear Directamente</a><br />
				<a href="04-36723/prestamos/">Mostrar Solicitudes</a>
			</p>
		</div>
entonces ahi es donde esta el problema, para el momento de darle click a un usuario en la lista de usuarios, me devuelve ese contenido generado dinamicamente, y en ese contenido esta el link <a href="#1" id="advertir" name="Advertir">(0) Advertir</a> cuyo id es obviamente "advertir" y es el que quiero que cause un efecto al ser presionado. como se puede ver en las lineas:
/*
* Advertir
*/
$('advertir').addEvent('click', function(e) {
e = new Event(e).stop();
advt.toogle();
});

el error que tengo es que como $('advertir') ,que es similar a getElementById('advertir') en mootools, (no se si en las otras librerias tambien, no manejo mucho js ni nada asi que solo hablo de lo poco que he aprendido de mootools :P) no lo consigue el javascript al cargar la pagina me da el error de $(advertir) has no properties.

Creo que la cuestion esta en que todo esto esta en un window.addEvent('domready', function...), al momento de cargar el dom inicial, donde no esta a#advertir, me da este error. pero n he logrado corregirlo :S
__________________
In a world without walls, who needs Windows?
  #5 (permalink)  
Antiguo 29/07/2007, 18:15
Avatar de stock  
Fecha de Ingreso: junio-2004
Ubicación: Monterrey NL
Mensajes: 2.390
Antigüedad: 20 años, 5 meses
Puntos: 53
Re: getElementById y ajax :S

si, ahora si entiendo tu problema, y efectivamente te sale siempre el error, esto es por que estas intentando accesar a un nodo inexistente, pues este nodo se agrega al DOM cuando haces la llamada con AJAX al servidor, tienes que cambiar esa parte, hay muchas maneras de resolver este problemas, aqui una posible solucion:

quita este codigo par que no se ejecute cuando se carga por primera vez la pagina
/*
* Advertir
*/
$('advertir').addEvent('click', function(e) {
e = new Event(e).stop();
advt.toogle();
});

metelo dentro de una funcion, ahora cuando hagas tu llamada con AJAX, recibas la informacion y la agregues al DOM, entonces inmediatamnte despues invocas a la funcion que creaste, con esto te debe funcionar.

have funnnnnn
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 19:40.