Foros del Web » Programando para Internet » Jquery »

como situo la respuesta de load() jquery

Estas en el tema de como situo la respuesta de load() jquery en el foro de Jquery en Foros del Web. hola quiciera saber cuando llamo la funcion load de jquery como hago para que echo de la pagina php imprima en una parte pretederminada.......quiero hacer ...
  #1 (permalink)  
Antiguo 14/03/2010, 11:32
Avatar de RIVERMILLOS  
Fecha de Ingreso: marzo-2010
Mensajes: 1.336
Antigüedad: 14 años
Puntos: 15
[SOLUCIONADO]como situo la respuesta de load() jquery

hola quiciera saber cuando llamo la funcion load de jquery como hago para que echo de la pagina php imprima en una parte pretederminada.......quiero hacer una galeria por paginacion pero no se como hacer para que cuando cambie de "pagina " el resultado de las fotos queden donde estaban las anteriores.

saludos

Última edición por RIVERMILLOS; 15/03/2010 a las 15:25
  #2 (permalink)  
Antiguo 14/03/2010, 11:50
Avatar de mayid
Colaborador
 
Fecha de Ingreso: marzo-2009
Ubicación: BsAs
Mensajes: 4.014
Antigüedad: 15 años
Puntos: 101
Respuesta: como situo la respuesta de load() jquery

Si tenes un div identificado, y queres actualizar sus contenidos, podes hacer esto:

<div id="target">
... contenidos ...
</div>

$("#target").html("<p>Nuevos contenidos que reemplazan a los anteriores</p>");

De similar manera, pero usando ajax, podrías hacer:

$("#target").load("url.php");

Y vas a tener tu php sobreescribiendo el contenido original.

nota: si no lo quisieras sobreescribir, usarías metodos como .append()
  #3 (permalink)  
Antiguo 15/03/2010, 07:11
Avatar de RIVERMILLOS  
Fecha de Ingreso: marzo-2010
Mensajes: 1.336
Antigüedad: 14 años
Puntos: 15
Respuesta: como situo la respuesta de load() jquery

Cita:
Iniciado por mayid Ver Mensaje
Si tenes un div identificado, y queres actualizar sus contenidos, podes hacer esto:

<div id="target">
... contenidos ...
</div>

$("#target").html("<p>Nuevos contenidos que reemplazan a los anteriores</p>");

De similar manera, pero usando ajax, podrías hacer:

$("#target").load("url.php");

Y vas a tener tu php sobreescribiendo el contenido original.

nota: si no lo quisieras sobreescribir, usarías metodos como .append()
hola muchas gracias por tu respuesta ,tengo otra duda pero si quiero mandar los datos a la misma url me refiero el script de jaquey esta en home.php y si en el load quiero escribir home.php?hola es valido???

saludos...
  #4 (permalink)  
Antiguo 15/03/2010, 07:19
Avatar de mayid
Colaborador
 
Fecha de Ingreso: marzo-2009
Ubicación: BsAs
Mensajes: 4.014
Antigüedad: 15 años
Puntos: 101
Respuesta: como situo la respuesta de load() jquery

Depende. Si tenes un condicional en PHP, que evite recarga todo el <head>, los scripts, etc,etc,etc, es válido. Pero me parece que hacerlo así sería ensuciar tu pagina. Pone el php en pagina aparte, que es mucho mejor. Si necesitas pasar variables, eso no es ningun problema.
  #5 (permalink)  
Antiguo 15/03/2010, 07:24
Avatar de RIVERMILLOS  
Fecha de Ingreso: marzo-2010
Mensajes: 1.336
Antigüedad: 14 años
Puntos: 15
Respuesta: como situo la respuesta de load() jquery

Cita:
Iniciado por mayid Ver Mensaje
Depende. Si tenes un condicional en PHP, que evite recarga todo el <head>, los scripts, etc,etc,etc, es válido. Pero me parece que hacerlo así sería ensuciar tu pagina. Pone el php en pagina aparte, que es mucho mejor. Si necesitas pasar variables, eso no es ningun problema.
hola mira este es el codigo que necesito recargar por jquery ....la variable tmp es un array con los nombres de fotos pero quiero que tome solo de ha 10 y que con un link me tome las siguiente 10 y las actualice .....ojala me pudieras ayudar como re estructuro todo en otro php...

Código:
if(isset($_GET['resul'])){

$tmp =$_SESSION['array'];

if(count($tmp)==0){

echo '
  <script type="text/javascript">
  alert("No Hay Registros");
  </script>';
			
	}else{
		echo'
<div id="fotos"></div>
<div class="foto">
<ul class="lul">
';
		$gale = new gallery();
		$gale->loadFolder('../FTP/'.$folder.'');
		sort($gale->files);
		for($i=0; $i<count($tmp);$i++){
			echo'<li><img width="100" height="100" id="'.$tmp[$i].'" border="4px" class="thumb" src="'.$gale->path.'/'.$tmp[$i].'" /></li>';
		}

echo'</ul>
</div>
<img id="prev" class="prev" src="estilo/images/iqz.png"></img>
<img id="next" class="next" src="estilo/images/dere.png"></img>';	
	}
}
saludos
  #6 (permalink)  
Antiguo 15/03/2010, 07:37
Avatar de mayid
Colaborador
 
Fecha de Ingreso: marzo-2009
Ubicación: BsAs
Mensajes: 4.014
Antigüedad: 15 años
Puntos: 101
Respuesta: como situo la respuesta de load() jquery

Cita:
<ul class="lul">
';
$gale = new gallery();
$gale->loadFolder('../FTP/'.$folder.'');
sort($gale->files);
for($i=0; $i<count($tmp);$i++){
echo'<li><img width="100" height="100" id="'.$tmp[$i].'" border="4px" class="thumb" src="'.$gale->path.'/'.$tmp[$i].'" /></li>';
}

echo'</ul>
A esto lo podes tener perfectamente en otro pagina. Y pasarle una variable GET para que cargue lo necesario:

$("#target").load("url.php?var=val", function(respuesta){alert (respuesta);});
  #7 (permalink)  
Antiguo 15/03/2010, 08:47
Avatar de RIVERMILLOS  
Fecha de Ingreso: marzo-2010
Mensajes: 1.336
Antigüedad: 14 años
Puntos: 15
Respuesta: como situo la respuesta de load() jquery

Listo ya puedo hacer lo que tu me dijiste pero tengo un problema

este trozo de codigo era utilizado por otros script de jquery y ya no lo toma como puedo hacer para que los tome .......

Código:
for($i=0; $i<count($tmp);$i++){
echo'<li><img width="100" height="100" id="'.$tmp[$i].'" border="4px" class="thumb" src="'.$gale->path.'/'.$tmp[$i].'" /></li>';
}

saludos
  #8 (permalink)  
Antiguo 15/03/2010, 09:01
Avatar de mayid
Colaborador
 
Fecha de Ingreso: marzo-2009
Ubicación: BsAs
Mensajes: 4.014
Antigüedad: 15 años
Puntos: 101
Respuesta: como situo la respuesta de load() jquery

No se si entiendo. Ese codigo PHP imprime algo de html. Luego de impreso, jquery puede modificarlo. SI el problema que estas teniendo es que jquery intenta modificar algo que todavía no existe... entonces hay prioridades que resolver. Fijate que las llamadas ajax tienen una sección para ejecutar codigo "tras haber cargado los contenidos":

$("#target").load("url.php?var=val", function(respuesta){alert (respuesta);});
  #9 (permalink)  
Antiguo 15/03/2010, 09:16
Avatar de RIVERMILLOS  
Fecha de Ingreso: marzo-2010
Mensajes: 1.336
Antigüedad: 14 años
Puntos: 15
Respuesta: como situo la respuesta de load() jquery

Cita:
Iniciado por mayid Ver Mensaje
No se si entiendo. Ese codigo PHP imprime algo de html. Luego de impreso, jquery puede modificarlo. SI el problema que estas teniendo es que jquery intenta modificar algo que todavía no existe... entonces hay prioridades que resolver. Fijate que las llamadas ajax tienen una sección para ejecutar codigo "tras haber cargado los contenidos":

$("#target").load("url.php?var=val", function(respuesta){alert (respuesta);});

mmm creo que no me entendiste o no te entendi lo que me dijiste XD , te explico bn ese codigo yo lo tenia en otro php antes de que tu me dijera que lo pasara a otro cuando uno le daba click en una imagen por jquery mostraba la imagen en un div y le tenia el efecto carrusel pero ahora ya no me toma esos efectos es mi pregunta ...

saludos
  #10 (permalink)  
Antiguo 15/03/2010, 09:30
Avatar de mayid
Colaborador
 
Fecha de Ingreso: marzo-2009
Ubicación: BsAs
Mensajes: 4.014
Antigüedad: 15 años
Puntos: 101
Respuesta: como situo la respuesta de load() jquery

Sostengo lo que dije. No hablemos de que jquery usa codigo PHP porque eso no es posible. Hablemos del html. Que lo imprimas desde la misma pagina o desde una pagina externa da perfectamente lo mismo. Tu enfoque tiene que ser en el lado cliente. Hay html para manipular?
  #11 (permalink)  
Antiguo 15/03/2010, 09:42
Avatar de RIVERMILLOS  
Fecha de Ingreso: marzo-2010
Mensajes: 1.336
Antigüedad: 14 años
Puntos: 15
Respuesta: como situo la respuesta de load() jquery

Cita:
Iniciado por mayid Ver Mensaje
Sostengo lo que dije. No hablemos de que jquery usa codigo PHP porque eso no es posible. Hablemos del html. Que lo imprimas desde la misma pagina o desde una pagina externa da perfectamente lo mismo. Tu enfoque tiene que ser en el lado cliente. Hay html para manipular?
si manipula las fotos ....


saludos
  #12 (permalink)  
Antiguo 15/03/2010, 09:45
Avatar de mayid
Colaborador
 
Fecha de Ingreso: marzo-2009
Ubicación: BsAs
Mensajes: 4.014
Antigüedad: 15 años
Puntos: 101
Respuesta: como situo la respuesta de load() jquery

Yo a veces lo que hago es imprimir la primera pagina usando include() de PHP. Y luego, por ejmplo para la paginación que querés, uso ajax. Pero lo mejor es usar siempre ajax, porque si no entrarías en problemas con las rutas relativas.
  #13 (permalink)  
Antiguo 15/03/2010, 09:49
Avatar de RIVERMILLOS  
Fecha de Ingreso: marzo-2010
Mensajes: 1.336
Antigüedad: 14 años
Puntos: 15
Respuesta: como situo la respuesta de load() jquery

que pena contigo pero no estoy entendiendo....osea que no puedo hacer es manipular con jquery lo que devuelve .load().. eso es.. creo que estamos hablando de dos cosas muy diferente..

saludos
  #14 (permalink)  
Antiguo 15/03/2010, 10:06
Avatar de RIVERMILLOS  
Fecha de Ingreso: marzo-2010
Mensajes: 1.336
Antigüedad: 14 años
Puntos: 15
Respuesta: como situo la respuesta de load() jquery

ya hice una pruba pero quiero saber si asi es que lo tenia que hacer .

los efectos que me faltaban los coloque hay mismo en el php nuevo que me dijiste..

Código:
<?php
session_start();
require_once '../Logic/gallery.php';
$folder=$_SESSION['usuario'];
$tmp=$_SESSION['array'];
$gale = new gallery();
$gale->loadFolder('../FTP/'.$folder.'');
sort($gale->files);

for($i=0; $i<count($tmp);$i++){
echo'<li><img width="100" height="100" id="'.$tmp[$i].'" border="4px" class="thumb" src="'.$gale->path.'/'.$tmp[$i].'" /></li>';
}
echo'
 <script type="text/javascript">
 
$(function() {
	$(".foto").jCarouselLite({
	        btnNext: ".next",
	        btnPrev: ".prev",
	        visible:4,
	        circular :false,
	        speed:100
	   });
});

$(document).ready(function() {
	$(".thumb").mouseover(function() {
					// obtenemos el valor del atributo ID de la miniatura
						var imagen = this.id;
						// luego, asignamos ese valor, como fondo del <div> con ID "foto"

						$("#fotos").css("background-image",
								"url(../FTP/'.$folder.'/" + imagen + ")");
					
					
		});
});

  </script>
';
?>
saludos
  #15 (permalink)  
Antiguo 15/03/2010, 11:13
Avatar de mayid
Colaborador
 
Fecha de Ingreso: marzo-2009
Ubicación: BsAs
Mensajes: 4.014
Antigüedad: 15 años
Puntos: 101
Respuesta: como situo la respuesta de load() jquery

Cita:
osea que no puedo hacer es manipular con jquery lo que devuelve .load().. eso es.. creo que estamos hablando de dos cosas muy diferente..
Es que a veces al usar ajax hay un problema de sincronicazión. Eso es lo que digo. Espero que alguien más opine sobre esto, a ver si estamos hablando de cosas diferentes o no.

Tu script se ve bien!
  #16 (permalink)  
Antiguo 15/03/2010, 12:53
 
Fecha de Ingreso: diciembre-2009
Ubicación: Misiones
Mensajes: 867
Antigüedad: 14 años, 3 meses
Puntos: 65
Respuesta: como situo la respuesta de load() jquery

a ver, vos haces un load y te carga una lista con imágenes que tienen la clase "thumb"

Código HTML:
<li><img width="100" height="100" id="algunid" border="4px" class="thumb" src="laurl" /></li> 
a esas imágenes vos queres asignarle un evento mouseover

Código HTML:
	$(".thumb").mouseover(function() {
					// obtenemos el valor del atributo ID de la miniatura
						var imagen = this.id;
						// luego, asignamos ese valor, como fondo del <div> con ID "foto"

						$("#fotos").css("background-image",
								"url(../FTP/'.$folder.'/" + imagen + ")");
					
					
		});
pero ese evento no te fnciona al hacer el onload?


lo que pasa es jquery no maneja eventos en elementos creados dinamicamente con ajax, append, etc

para eso está el evento live, simplemente cambia la linea
Código HTML:
$(".thumb").mouseover(function() {
por

Código HTML:
$(".thumb").live('mouseover', function() {

no creo que sea muy limpio hacer un load y que me devuelva html y código jquery como respuesta, tratá que en tu php se genere html y lo que tenias de jquery ponelo en un archivo js

Última edición por Dany_s; 15/03/2010 a las 13:04
  #17 (permalink)  
Antiguo 15/03/2010, 13:40
Avatar de RIVERMILLOS  
Fecha de Ingreso: marzo-2010
Mensajes: 1.336
Antigüedad: 14 años
Puntos: 15
Respuesta: como situo la respuesta de load() jquery

Cita:
Iniciado por Dany_s Ver Mensaje
a ver, vos haces un load y te carga una lista con imágenes que tienen la clase "thumb"

Código HTML:
<li><img width="100" height="100" id="algunid" border="4px" class="thumb" src="laurl" /></li> 
a esas imágenes vos queres asignarle un evento mouseover

Código HTML:
	$(".thumb").mouseover(function() {
					// obtenemos el valor del atributo ID de la miniatura
						var imagen = this.id;
						// luego, asignamos ese valor, como fondo del <div> con ID "foto"

						$("#fotos").css("background-image",
								"url(../FTP/'.$folder.'/" + imagen + ")");
					
					
		});
pero ese evento no te fnciona al hacer el onload?


lo que pasa es jquery no maneja eventos en elementos creados dinamicamente con ajax, append, etc

para eso está el evento live, simplemente cambia la linea
Código HTML:
$(".thumb").mouseover(function() {
por

Código HTML:
$(".thumb").live('mouseover', function() {

no creo que sea muy limpio hacer un load y que me devuelva html y código jquery como respuesta, tratá que en tu php se genere html y lo que tenias de jquery ponelo en un archivo js
muchas gracias por tu respuesta , pero entendi lo que dices que mi php genere el html.


saludos
  #18 (permalink)  
Antiguo 15/03/2010, 13:53
Avatar de mayid
Colaborador
 
Fecha de Ingreso: marzo-2009
Ubicación: BsAs
Mensajes: 4.014
Antigüedad: 15 años
Puntos: 101
Respuesta: como situo la respuesta de load() jquery

Ha de ser eso, Dany. Claro! Que bueno que lo señalaste.

@Rivermillos: Dany ha querido decir "que el segundo archivo PHP genere el html" al decir "tratá que en tu php se genere html".
  #19 (permalink)  
Antiguo 15/03/2010, 13:55
Avatar de RIVERMILLOS  
Fecha de Ingreso: marzo-2010
Mensajes: 1.336
Antigüedad: 14 años
Puntos: 15
Respuesta: como situo la respuesta de load() jquery

Cita:
Iniciado por mayid Ver Mensaje
Ha de ser eso, Dany. Claro! Que bueno que lo señalaste.

@Rivermillos: Dany ha querido decir "que el segundo archivo PHP genere el html" al decir "tratá que en tu php se genere html".
pues es precisamente lo que tengo aqui no ??

Código:
<?php
session_start();

require_once '../Logic/gallery.php';
$folder=$_SESSION['usuario'];
$tmp=$_SESSION['array'];
$gale = new gallery();
$gale->loadFolder('../FTP/'.$folder.'');
sort($gale->files);
for($i=0; $i<count($tmp);$i++){
echo'<li><img width="100" height="100" id="'.$tmp[$i].'" border="4px" class="thumb" src="'.$gale->path.'/'.$tmp[$i].'" /></li>';
}
echo'
<script type="text/javascript">
$(function() {
	$(".foto").jCarouselLite({
	        btnNext: ".next",
	        btnPrev: ".prev",
	        visible:4,
	        circular :false,
	        speed:100
	   });});
</script>
';
?>

saludos
  #20 (permalink)  
Antiguo 15/03/2010, 14:18
 
Fecha de Ingreso: diciembre-2009
Ubicación: Misiones
Mensajes: 867
Antigüedad: 14 años, 3 meses
Puntos: 65
Respuesta: como situo la respuesta de load() jquery

vamos a ver esto, modifique para que sea algo sencillo

si en el index imprimis la lista de imagenes y le asignas el evento mouseover funciona

Código PHP:
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <script>
    $( function (){
        $(".thumb").mouseover(function() {
            var imagen = this.id;
            $("#fotos").html("el valor de id "+imagen);
        });
    });
  </script>
</head>
<body>
    <div id="fotos"></div>
<?php
echo "<ul>";
for(
$i=0$i<5;$i++){
    echo
'<li><img width="10" height="10" id="'.$i.'" border="4px" class="thumb" src="url'.$i.'" /></li>';
}
echo 
"</ul>";
?>

</body>
</html>
-----------------------------


otra puede ser que el código php y jquery esté en otro archivo y lo cargo con load

el archivo index que llama a galeria.php va a ser
Código HTML:
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <script>
    $( function (){
        //Cargo la galeria que se encuentra en galeria.php en el div con id "galeria
        $('#galeria').load("galeria.php");
    });
  </script>
</head>
<body>
    <div id="fotos"></div>

    <div id="galeria"></div>

</body>
</html> 
el archivo php galeria.php con la porción de jquery va a ser
Código PHP:
<?php
echo "<ul>";
for(
$i=0$i<5;$i++){
    echo
'<li><img width="10" height="10" id="'.$i.'" border="4px" class="thumb" src="url'.$i.'" /></li>';
}
echo 
"</ul>";
?>
<script type="text/javascript">
$(".thumb").mouseover(function() {
    var imagen = this.id;
    $("#fotos").html("el valor de id "+imagen);
});
</script>
eso también funciona porque el codigo jquery esta en el archivo php que llamo con load

-------------------------

pero si está separado el html con jquery en el index:
Código HTML:
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <script>
    $( function (){
        //Cargo la galeria que se encuentra en galeria.php en el div con id "galeria
        $('#galeria').load("galeria.php");

        $(".thumb").mouseover(function() {
            var imagen = this.id;
            $("#fotos").html("el valor de id "+imagen);
        });

    });
  </script>
</head>
<body>
    <div id="fotos"></div>

    <div id="galeria"></div>

</body>
</html> 
y en galeria.php tengo solo php que imprime la lista de imagenes
Código PHP:
<?php
echo "<ul>";
for(
$i=0$i<5;$i++){
    echo
'<li><img width="10" height="10" id="'.$i.'" border="4px" class="thumb" src="url'.$i.'" /></li>';
}
echo 
"</ul>";
?>

eso no funciona porque la lista de imagen se crea dinamicamente con load y no se puede manejar eventos pero para arreglar eso existe el metodo live
reemplazas
$(".thumb").mouseover(function() {
por
$(".thumb").live('mouseover',function() {
y vas a ver que funciona


trata de que funcione primero con ejemplos similares sencillos que sean estáticos, la parte que posteas de php
como:
require_once '../Logic/gallery.php';
$folder=$_SESSION['usuario'];
$tmp=$_SESSION['array'];
$gale = new gallery();
$gale->loadFolder('../FTP/'.$folder.'');


y el loop que genera la lista no sirve, es solo para confusión

hace el html estático
  #21 (permalink)  
Antiguo 15/03/2010, 14:48
Avatar de RIVERMILLOS  
Fecha de Ingreso: marzo-2010
Mensajes: 1.336
Antigüedad: 14 años
Puntos: 15
Respuesta: como situo la respuesta de load() jquery

muchas gracias por tu respuesta yo lo tengo exactamente como el segundo ejemplo que colocaste....pero aun no entiendo que me quieres dar a entender ? osea mi codigo esta mal??

saludos
  #22 (permalink)  
Antiguo 15/03/2010, 15:13
 
Fecha de Ingreso: diciembre-2009
Ubicación: Misiones
Mensajes: 867
Antigüedad: 14 años, 3 meses
Puntos: 65
Respuesta: como situo la respuesta de load() jquery

jeje no, para nada

digo que te conviene publicar solo código html y jquery porque hay personas que te pueden ayudar pero como ven código php no llegan a entender que es lo que quieres hacer y por eso es mejor que te crees un ejemplo sencillo similar a tu problema con solo html/jquery y publiques eso así es más fácil de leer y más personas te pueden ayudar jeje


fijate de hacer algo sencillo solo con html y publica el código completo asi vemos como quedo todo y descubrimos el problema
  #23 (permalink)  
Antiguo 15/03/2010, 15:24
Avatar de RIVERMILLOS  
Fecha de Ingreso: marzo-2010
Mensajes: 1.336
Antigüedad: 14 años
Puntos: 15
Respuesta: como situo la respuesta de load() jquery

ahhh jajaja ya entendi jejeje pues ya no tengo el problema lo solucione asi ....

en mi index coloque el javascript

Código:
$(".thumb").live("click", function() {

// obtenemos el valor del atributo ID de la miniatura
						var imagen = this.id;
						// luego, asignamos ese valor, como fondo del <div> con ID "foto"

						$("#fotos").css("background-image",
								"url(../FTP/'.$folder.'/" + imagen + ")");
}
);

para que me funciones con lo que carga este php..

Código:
for($i=$ini;$i<$fin;$i++){
echo'<li><img width="100" height="100" id="'.$tmp[$i].'" border="4px" class="thumb" src="'.$gale->path.'/'.$tmp[$i].'" /></li>';
}

y ahora si toma los eventos.

mil gracias

Etiquetas: load, respuesta
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 06:48.