Foro de elhacker.net

Programación => Desarrollo Web => Mensaje iniciado por: |Miguel| en 26 Marzo 2012, 20:08 pm


Título: {RESUELTO}Cargar documento dentro de una celda, mediante javascript+jquery
Publicado por: |Miguel| en 26 Marzo 2012, 20:08 pm
Bueno, pues eso, básicamente, xD

Que llevo un par de días intentando hacer una cosa... tengo una tabla (más o menos) así:
___________________________
|      |       |           |         |        |
___________________________
|                                              |
|                                              |
|                                              |
|                                              |
|                                              |
___________________________
|                                              |
|                                              |
___________________________

Donde las celdas de arriba son un menú, la del centro contiene un iframe para cargar lo que quiero ver y lo de abajo es un pie de página sin más.

La función que uso para cargar lo que quiero en el iframe es esta:
Código
  1. function carga(pagina){
  2. 	$("#contenido").load(pagina);
  3. }
  4.  

Y la llamada (he probado esas dos formas para hacer la llamada):
Código
  1. <table id="tab" width="100%" align="center" border="1">
  2.    <tr>    	
  3.         <td onclick="carga('news.html');" style="cursor: pointer">
  4.         	<img src="../img/home.png" alt="Home" />
  5.         </td>
  6.         <td style="cursor:pointer">
  7.         	<a href="javascript:carga('perfil');">Mi perfil</a>
  8.     	</td>
  9.    </tr>
  11.  

Pero no hace nada... ¿alguien sabe dónde he metido la pata?

El código del irame es:
Código
  1. <iframe frameborder="0" id="contenido" width="100%" scrolling="auto">
  2.  
  3.             </iframe>

Título: Re: Cargar documento dentro de una celda, mediante javascript+jquery
Publicado por: Spider-Net en 26 Marzo 2012, 21:41 pm
Pues sí, o usas ajax o usas un iframe, pero no mezcles las dos cosas xD

En vez de un iframe usa un div: <div id="contenido"></div> y debe funcionar bien.

Título: Re: Cargar documento dentro de una celda, mediante javascript+jquery
Publicado por: |Miguel| en 26 Marzo 2012, 21:49 pm
He usado un iframe para que solo esa celda de la tabla, la del contenido, tenga scroll. ¿puedo lograr ese efecto con el div?

EDITO:

He cambiado el iframe por:
Código
  1. 	<div id="contenido" width="100%">
  2.  
  3.         </div>
  4.  
Y no hace nada.

EDITO 2:
He probado esto, y me hace el alert pero no carga nada... asíque el fallo tiene que estar en la línea del load... :S
Código
  1. function carga(pagina){
  2. 	$("#contenido").load(pagina);
  3. 	alert('cargada');
  4. }
  5.  

Título: Re: Cargar documento dentro de una celda, mediante javascript+jquery
Publicado por: Spider-Net en 26 Marzo 2012, 22:09 pm
No carga nada porque estás pasando como parámetro de la página el nombre a secas, sin extensión:
Código
  1. <a href="javascript:carga('perfil');">Mi perfil</a>

Y luego en jquery tampoco se lo añades, lo que haces es:

Código
  1. function carga(pagina){
  2. 	$("#contenido").load(pagina);
  3. }

Tienes alguna página que se llame perfil a secas?, lo dudo. Se llamará perfil.html o perfil.php. Por lo tanto yo lo haría así:
 
Código
  1. function carga(pagina){
  2. 	$("#contenido").load(pagina+".html");
  3. }

o ".php" en caso de que sea php lo que vas a cargar. Por otro lado para que el div tenga scroll en la propiedad css del div contenido pon la propiedad overflow-y: scroll.

Saludos.

Título: Re: Cargar documento dentro de una celda, mediante javascript+jquery
Publicado por: |Miguel| en 26 Marzo 2012, 22:17 pm
Cita de: Spider-Net en 26 Marzo 2012, 22:09 pm
No carga nada porque estás pasando como parámetro de la página el nombre a secas, sin extensión

Error mío, he copiado una versión antigua. Sí que tengo puesta la extensión en el código.

Lo del scroll, perfecto, gracias.

Título: Re: Cargar documento dentro de una celda, mediante javascript+jquery
Publicado por: Spider-Net en 26 Marzo 2012, 22:20 pm
¿Y poniendo la extensión tampoco te carga nada? ¿Puedes poner tu código actual?

Título: Re: Cargar documento dentro de una celda, mediante javascript+jquery
Publicado por: |Miguel| en 26 Marzo 2012, 22:23 pm
El trocito de la llamada es este:

Código
  1. <a href="javascript:carga('perfil.html');" target="contenido">Mi perfil</a>

función:
Código
  1. function carga(pagina){
  2. 	$("#contenido").load(pagina);
  3. 	//alert('cargada '+pagina);
  4. }

y capa:
Código
  1. <div id="contenido">contenido</div>

Si quieres pongo todo el resto, pero creo q con eso es suficiente.

Título: Re: Cargar documento dentro de una celda, mediante javascript+jquery
Publicado por: Spider-Net en 26 Marzo 2012, 22:31 pm
el target="contenido" en el enlace sobra. No sé si será eso, pero debe de ser porque lo demás está correcto.

Título: Re: Cargar documento dentro de una celda, mediante javascript+jquery
Publicado por: |Miguel| en 26 Marzo 2012, 22:51 pm
Se me olvidó, de una prueba con el iframe, pero aún quitándolo da igual... ademas tengo esta otra llamada:
Código
  1. <body onload="altoFrame(); carga('news.html')">
Que se me olvidó ponerla antes, aunque es lomismo que las otras practicamente, pero no funciona en ninguna. Sé que hace la llamada porque he descomentado el alert, pero no carga.

Título: Re: Cargar documento dentro de una celda, mediante javascript+jquery
Publicado por: Spider-Net en 26 Marzo 2012, 22:59 pm
Pues como no se te haya olvidado incluir el archivo de jquery, o haya algún problema de ese tipo la verdad es que no lo entiendo porque lo demás parece estar todo bien.

Título: Re: Cargar documento dentro de una celda, mediante javascript+jquery
Publicado por: |Miguel| en 27 Marzo 2012, 00:12 am
Sí sí está incluido. Y de hecho pensé que podía ser algo de eso y he buscado en la documentación haber si hay alguna forma sencilla de ver si está correctamente incluido y si la hay...
if(jQuery) alert('si');

y sí hace el alert. No lo entiendo...

Título: Re: Cargar documento dentro de una celda, mediante javascript+jquery
Publicado por: Spider-Net en 27 Marzo 2012, 00:51 am
Supongo que todos los archivos que intentas cargar como por ejemplo el archivo perfil.html se encuentra en el mismo directorio que el archivo principal no?

Título: Re: Cargar documento dentro de una celda, mediante javascript+jquery
Publicado por: |Miguel| en 27 Marzo 2012, 00:54 am
Sí. por supuesto.... no sé, voy a probar a subirlo a internet con ruta absoluta a ver...

EDITO: antes de tocar nada, he subido lo que tengo y funciona bien, excepto el scroll de la capa. :S

Título: Re: Cargar documento dentro de una celda, mediante javascript+jquery
Publicado por: Spider-Net en 27 Marzo 2012, 01:14 am
El scroll de la capa es css, y debe aparecer on-overflow. Osea, cuando el archivo que insertes en el load sobrepase la altura del div aparecerá, sino no. Con overflow-y: scroll; debería bastar :S

Título: Re: Cargar documento dentro de una celda, mediante javascript+jquery
Publicado por: |Miguel| en 27 Marzo 2012, 01:16 am
En local me funciona el scroll pero no la carga de la página, y en el servidor al reves... no se si reir o llorar... xD

Título: Re: Cargar documento dentro de una celda, mediante javascript+jquery
Publicado por: Spider-Net en 27 Marzo 2012, 01:34 am
(http://desmotivaciones.es/demots/201107/pajar_2.jpg)

No ahora en serio xD, debería funcionar tio. Subiste el CSS al servidor? a ver si se te olvidó y por eso no está funcionando...

Establece un height para el div contenido sino. Ponle por ejemplo: height: 300px; y cualquier archivo que sobrepase esa altura debería hacer que automáticamente aparezca el scroll.

Título: Re: Cargar documento dentro de una celda, mediante javascript+jquery
Publicado por: |Miguel| en 27 Marzo 2012, 01:43 am
Bien, bien, bien...

He resubido todo 5 veces. Y nada.
He borrado todo, lo he subido (sin tocar código) y funciona. guay. XD ;-)

Pero no entiendo porqué en local no va la funcioncita de los -------...

Título: Re: Cargar documento dentro de una celda, mediante javascript+jquery
Publicado por: Spider-Net en 27 Marzo 2012, 02:29 am
Pues si no tienes instalado un servidor web en local, pues supongo que es por eso xD

Título: Re: Cargar documento dentro de una celda, mediante javascript+jquery
Publicado por: jhonatanAsm en 27 Marzo 2012, 04:14 am
Citar
Pero no entiendo porqué en local no va la funcioncita de los -------...

el load() de jquery funciona desde la web, o en tu pc si tienes un servidor.

ejecutarlo de otra manera no funka.salu2

 

Título: Re: Cargar documento dentro de una celda, mediante javascript+jquery
Publicado por: |Miguel| en 27 Marzo 2012, 11:38 am
(http://www.wackybuttons.com/designcodes/110/1102350.jpg)

Un profesor me dijo q el javascript funciona siempre en cliente y no necesita estar subido... ¬¬

Gracias.

Título: Re: Cargar documento dentro de una celda, mediante javascript+jquery
Publicado por: Spider-Net en 27 Marzo 2012, 13:24 pm
Profesores que aún viven en los 90 y no actualizan sus conocimientos. Me ha pasado miles de veces durante mi época de estudiante. Tuve profesores que se empeñaban en obligarnos a hacer webs con frames, porque según ellos eso era el futuro. A la vista está lo que se usan hoy en día los frames... gente que ha aprendido a hacer webs en los 80 y los 90 y se resignan a actualizarse xD

Título: Re: Cargar documento dentro de una celda, mediante javascript+jquery
Publicado por: |Miguel| en 27 Marzo 2012, 14:01 pm
También es cierto q a ese profesor le tuve hace 3 años... pero la función load() me la enseñó él... ya podría saber de lo que habla joder

Bueno, saludos y gracias.

Título: Re: Cargar documento dentro de una celda, mediante javascript+jquery
Publicado por: jhonatanAsm en 27 Marzo 2012, 22:32 pm
quizá esté de más decirlo pero :-X... lo digo  :):

tus trabajos, ejercicios,etc. recomiendo ejecutarlos siempre en el servidor.salu2

Título: Re: Cargar documento dentro de una celda, mediante javascript+jquery
Publicado por: |Miguel| en 28 Marzo 2012, 00:30 am
Cita de: jhonatanAsm en 27 Marzo 2012, 22:32 pm
quizá esté de más decirlo pero :-X... lo digo  :):

tus trabajos, ejercicios,etc. recomiendo ejecutarlos siempre en el servidor.salu2
Nada está de más!
Todos los consejos se agradecen :)


Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines