case con ajax

[manzabud]

como hacer el paginado que hace facebook que cada vez que le da sobre el boton: previous o next te pone al final de la url algo como esto:

#/photo.php?pid=31002059&id=1181977464&fbid=13321481 02068

si se dan cuenta el comienza con un # como si estuviera llamando a un div pero en realidad lo que hace es cargar la siuiente foto o la anterior dependiendo de lo que clickes......


Este comportamiento tambien se puede ver en twitter.. cada vez que quieres hacer una busqueda en la pagina princiapal tuya luego de haber logueado a la url te coloca al final algo como esto:

#search?q=Dios...

Lo que en realidad me gusta de esto es que no tienes que recargar la pagina para irte al otro case que uno tiene en la pagina php.. en este caso lo que quiero hacer es algo como esto:

inbox.php?mg=cp#inbox.php?mg=cp

para que no recargue la pagina y paresca que uso ajax.. o en su efecto puede que sea ajax pero no lo se usar... les agradesco su ayuda..

[pateketrueke]

bueno, es claro que es Ajax... y si no lo sabes usar, por favor... investiga al respecto...

no esperes a que te lleven de la mano, bien puedes empezar tu mismo... (:

[manzabud]

peter es este mismo caso como el de aca:

/#post3243527

fijate arriba... y te puedo decir que he investigado y tengo conocmientos en ajax, se puede decir que mas o menos bastante pero esto no lo he podido ahcer, y si pido ayuda es porque en realidad la necesito

[manzabud]

cuando me refiero a que:
"o en su efecto puede que sea ajax pero no lo se usar... les agradesco su ayuda.."

me refiero a esta tema de colocar: #search?q=text
y que esti cargue a su ves cargue una funcion en ajax

[pateketrueke]

es mas fácil si lo visualizas así...

#foo.php?q=v

Código:

var str = (document.location.href).toString().split('#');
var script = str[1]; // foo.php?q=v

$.ajax({
  url: script,
  method: 'get'
});

la idea, es obtener el trozo después de # y usar dicha información para implementar Ajax...

todo es cuestión de ingenio y visión, lo siento si no puedes visualizarlo así... (:

[manzabud]

Gracias lo probare..!

[manzabud]

querido amigo lo vi y lo entendi pero no imagino como terminar el codigo ya que lo he intentado pero de ninguna forma me da resultado...me gustaria implementar esto con una pagina php que utiliza cases deesta manera podria visualizar los contenido de los distintos cases sin la necesidad de recargar la pagina... si eres tan amable te pediria que me ayudaras a terminar este codigo...

Realmente estaria muy agradecido contigo!!!

[pateketrueke]

mira, el problema no esta en el Ajax... obviamente está en como implementaste tu script...

pero bueno, si esperas a que adivinemos el código para ayudarte... ¡no creo que te sientas muy agradecido después!!

pero vamos, es sencillo... siguiendo el ejemplo anterior

foo.php?q=v

Código PHP:

  switch ($_GET['q'])
{
  case 'v': echo 'OK'; break;
  default: break;
} 
   

eso es todo... claro, que para implementar Ajax debes saber utilizarlo... y ya sabes... ;)

[manzabud]

bueno hermano.. tenemos esto

Código:

<script>
var str = (document.location.href).toString().split('#');
var script = str[1]; // inbox.php?mg=st

$.ajax({
  url: script,
  method: 'get'
});
</script>

Código PHP:

<?php
switch ($_GET['mg']) 
{ 
  case 'st':
  echo 'OK';
  break; 
  
  default:
  echo 'DEFAULT';
  break; 
}
?>
 

bueno mi pregunta ahora es que colocarle al link en href ¿?
<a href="#inbox.php?mg=st">sent</a>
asi? o como?
La otra pregunta es si le deberiamos colocar algo mas al codigo ajax.. porque como te dije lo heintentado de varias maneras y no me resulta..


Y bueno de lo que entiendo.. deberiamos como hacer que el contenido se vuelque en un div..

Gracias por tu ayuda!!

[pateketrueke]

entonces necesitas familiarizarte con Ajax, la sintaxis que yo uso es la de jQuery...

deberías usarlo, es un framework para JS ... que tiene métodos sencillos para Ajax, así como inyectar el resultado en un <div/>, etc...

otra cosa importante, según cada quien su propia técnica, pero... el enlace no lo debes colocar manualmente, deberías hacerlo igualmente con Javascript

Código HTML:

<a href="foo.php?q=v" rel="ajax">enlace</a> 

y con jQuery consigues que estos enlaces, se pasen vía Ajax...

Código javascript:

$(function(){
  $('a[rel=ajax]').bind('click', function(){
    document.location.href='#'+this.href;
    // ejecutamos el ajax...
    return false;
  });
});
 

o al menos así es la idea...

[manzabud]

gracias m,i hermano.. eres bueno...
ya conosco jquery.. lo voy a tratar de implementar de nuevo...
Con esto que me acabas de dar me has dado mas luz..

Buena por esta!!!

[pateketrueke]

jeje... creo que para las próximas, asumiré que ya se tiene un dominio básico de jQuery en estos casos... (:

[manzabud]

hermano tengo esto:

Código PHP:

 <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(function(){
* $('a[rel=ajax]').bind('click', function(){
* * document.location.href='#'+this.href;
* * // ejecutamos el ajax...

    var str = (document.location.href).toString().split('#');
    var script = str[1]; // inbox.php?mg=st

    $.ajax({
      url: script,
      method: 'get'
    });


* * return false;
* });
});

</script>

<body>
<a href="ajaxcase.php?q=v" rel="ajax">enlace</a>


<?php
switch ($_GET['q']) {
    case 'v':
        echo "works";
        break;

    default:
       echo "do it";
}
?>
</body>  

se que le falta la parte del div para que me bote el resultado en un div pero es que ni si quiera me genera el signo numeral en la url sino que funciona como cualquier link como si no tuviera una funcion ajax que la estuviera vigilando...

Disculpame si de pronto te estoy preguntando mucho... pero no imaginas lo agradecido que estoy... en realidad necesito esto...

[pateketrueke]

dos detalles...

¿estas seguro que esta bien tu código??
- porque yo veo errores sintácticos en la parte de Javascript...

el script que procesa la petición GET debe ser un script independiente, no el mismo...

[manzabud]

Iniciado por pateketrueke

dos detalles...

¿estas seguro que esta bien tu código??
- porque yo veo errores sintácticos en la parte de Javascript...

el script que procesa la petición GET debe ser un script independiente, no el mismo...

entonces cuando tu dices> ejecutemos el ajax... a que te refieres... por favor necesito tu ayuda

Edited: y es que aun separandolos.. me refiero es que cuando le doy click al enlace ni si quiera me le antepone el signo numeral, es como si no estuviera haciendo relacion a nada..
Conosco de AJax pero cno tanto como de PHP, es por esto que necesito tu ayuda amigo, tu eres bueno.. por favor dame una manno, no quiero divagar en la internet donde no he podido conseguir esto...

GRACIAS!

[GatorV]

Tema movido desde PHP a AJAX

[manzabud]

Es mas mira probando yo podriamos hacer algo asi:

Código HTML:

<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(function(){
* $('a[rel=ajax]').bind('click', function(){
* * document.location.href='#'+this.href;
* * // ejecutamos el ajax...
 
* * return false;
* });
});
 
</script>
 
<script type="text/javascript">
    var str = (document.location.href).toString().split('#');
    var script = str[1]; // inbox.php?mg=st
 
   $.ajax({
            url: script,    
            type: "GET",        
            data: data,     
            cache: false,
            success: function (html) {  
                $('.loading').hide();               
                $('#content').html(html);
                $('#body').fadeIn('slow');      
        
            }       
        });
</script>
 
<body>
<a href="ajaxcase.php?q=v" rel="ajax">enlace</a>
 
 
<?php
switch ($_GET['q']) {
    case 'v':
        echo "works";
        break;
 
    default:
       echo "do it";
}
?>
</body>
 

pero corrigeme en lo qu eeste mal porfavor.. he estado mirando varias paginas y praticamente hacen lo que yo quiero pero no es tal cual lo quiero.. por ejemplo ellos trabajan directamente con el signo numeral en el link pero yo quiero algo mas profesional y con variables get asi como esto:

Código HTML:

<a href="ajaxcase.php?q=v" rel="ajax">enlace</a>
 

y NO asi:

Código HTML:

<a href="#page1" rel="ajax">enlace</a>
 

[jeniar]

ola :D soy nuevo aqui.. estube leyendo de este tema.. y bueno aprendi cosas que no sabia ..
en cuanto a tu caso.. mira todo estaba bien.. solo k hay un pequeño detalle en el evento click .. cuando haces click en el enlace.. este tendra k cargar el ajax..

pero por ser una peticion ajax esta se ejecuta de manera asincrona.. asi que primero tienes k pevenir el evento por defecto del link con preventDefault()
de jquery antes que ejecutes tu llamada ajax y no despues.. de lo contrario no servira

Código HTML:

<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(function(){
 $('a[rel=ajax]').bind('click', function(event){
     document.location.href='#'+this.href;
    //prevenimos el  evento por defecto
    event.preventDefault();
    // ejecutamos el ajax...
    cargarPagina();
  });
});
 
</script>
 
<script type="text/javascript">
function cargarPagina(){
    var str = (document.location.href).toString().split('#');
    var script = str[1]; // inbox.php?mg=st
 
   $.ajax({
            url: script,    
            type: "GET",        
            data: data,     
            cache: false,
            success: function (html) {  
                $('.loading').hide();               
                $('#content').html(html);
                $('#body').fadeIn('slow');      
        
            }       
        });
}
</script>
 
<body>
 
<a href="ajaxcase.php?q=v" rel="ajax">enlace</a>
 
 
<?php
switch ($_GET['q']) {
    case 'v':
        echo "works";
        break;
 
    default:
       echo "do it";
}
?>
</body>
 

Saludos ... :D

ATTE. Gerson Pardo