Varias consultas ajax

[Heras7]

Hola, soy nuevo en esta web.

Resulta que estoy haciendo una web dinámica con php y según tengo entendido si quiero hacer varias consultas en la misma página sin refrescar necesito utilizar ajax.

No se ajax, si js y jquery, php y bueno mirando cosas más o menos entiendo.

El caso es que he visto un script que hace lo que yo quiero, pero no del todo.

Código:

         while($row = mysql_fetch_assoc($result))
         {
            echo '<script>fotografo[i] = ' . $row['id_f'] . ' </script>';
            echo '<li><a  id="enlaceajax" href="javascript:void(0)" onclick="mysql1(' . $row['id_f'] . ')">' . $row['nombre_f'] . '</a></li>';
         }

Esto es parte de mi codigo php que hace que me muestre por pantalla el un nombre de mi base de datos y me haga una referencia onclick.

Código:

function mysql1(a)
{
   jsql = ("SELECT nombre_s,id_s FROM sesion where id_f='"+a+"'");
}


$(document).ready(function()
{
   $("#enlaceajax").click(function(evento)
   {
     evento.preventDefault();
     $("#destino").load("sesion.php", {nombre: jsql}, function()
     {
       alert("recibidos los datos por ajax");
     });
   });
})

Y esta don dos funciones que esta en el .js que es una función para coger la id del nombre y luego reutilizarla (jsql) para que al pinchar en el nombre elegido, me muestre la siguiente relación de la tabla siguiente y me aparezca una nueva DIV.

Pues en principio lo hace bien. Quiero decir tengo 10 nombres, pincho el primero y me genera una nueva div con lo nuevo generado (en este caso los nombres de la siguiente tabla).

Y el problema que viene a continuación que es por el que pregunto es que solo funciona que el primer nombre de la lista, todos los demás nombres no hacen caso a la consulta ajax.

Y el segundo error me da cuando una vez generada la segunda tabla, creo otra función igual que la usada y el código aparece una vez hecha la primera consulta de ajax, y no lo reconoce.

[kokoou]

de casualidad a todos los enlaces les estas asignando el id "enlaceajax" ?

edito: acabo de ver que si :P

Lo que puedes hacer es en el while donde generas el enlace en vez de poner el mismo a id a todos los elementos, ponle la misma clase. Porque el ID como su noimbre los indica, es un Identificador del elemento, entonces no puedes tener 2 o mas ID iguales.

Haz esto:

Código PHP:

while($row = mysql_fetch_assoc($result))
         {
            echo '<script>fotografo[i] = ' . $row['id_f'] . ' </script>';
            echo '<li><a  class="enlaceajax" href="javascript:void(0)" onclick="mysql1(' . $row['id_f'] . ')">' . $row['nombre_f'] . '</a></li>';
         }
 

y en jQuery llamalo por la clase:

Código Javascript:

$(document).ready(function()
{
   $(".enlaceajax").click(function(evento)
   {
     evento.preventDefault();
     $("#destino").load("sesion.php", {nombre: jsql}, function()
     {
       alert("recibidos los datos por ajax");
     });
   });
})
 

[Heras7]

Gracias. Eso funcionó, no caí que siendo un id y metiendo un bucle no me iba a dejar.

Pero aun así persiste mi segundo problema.

Entonces ahora tengo

Código:

$(document).ready(function()
{
   $(".enlaceajax").click(function(evento)
   {
	  evento.preventDefault();
	  $("#destino").load("sesion.php", {nombre: jsql});
   });
})

Si quiero que una vez aparecido el nuevo div con la nueva consulta mysql. Al pinchar en la nueva consulta me haga otro div la segunda consulta nueva, sería así.

Código:

$(document).ready(function()
{
   $(".enlaceajax").click(function(evento)
   {
	  evento.preventDefault();
	  $("#destino").load("sesion.php", {nombre: jsql});
   });
   $(".enlaceajax2").click(function(evento)
   {
	  evento.preventDefault();
	  $("#destino2").load("fotos.php", {nombre2: jsql2});
   });
})

y el scritp

Código:

while($row = mysql_fetch_assoc($result))
{
	echo '<script>sesion[i] = ' . $row['id_s'] . ' </script>';
	echo '<li><a class="enlaceajax2" href="javascript:void(0)" onclick="mysql2(' . $row['id_s'] . ')">' . $row['nombre_s'] . '</a></li>';
}

Vamos creo yo, pero lo unico que hace es crear el 2 div que me cambia y el 3 div no sale

[Heras7]

Mira he aislado el otro problema pero no se que hacer.

Código:

html>
<head>
   <title>Ajax Simple</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript"></script>
<script>
$(document).ready(function()
{
   $("#enlaceajax").click(function(evento)
   {
      evento.preventDefault();
      $("#destino").load("recibe-parametro.php", {nombre: "Pepe", edad: 45}, function()
     {
         alert("recibidos los datos por ajax");
      });
   });
   $("#enlaceajax2").click(function(evento)
   {
      evento.preventDefault();
      $("#destino2").load("recibe-parametro2.php", {nombre2: "jose", edad2: 425}, function()
     {
         alert("recibidos los datos por ajax");
      });
   });
})
</script>
</head>
<body>

<a href="#" id="enlaceajax">Haz clic! a 1</a>
<br>
<section id="destino"></section>
<a href="#" id="enlaceajax2">Haz clic! a 2</a>                                      <----------------------------SI ESTO LO METO EN PARAMETRO 2                           
<br>
<section id="destino2"></section>
</body>
</html>

recibe-parametro.php

Código:

<html>
Recibido el siguiente dato:
<br>
Nombre: <?php echo $_POST["nombre"];?>
<br>
Edad: <?php echo $_POST["edad"];?>
<br>
</html>

recibe-parametro2

Código:

recibe-parametro2.php

<html>
Recibido el siguiente dato:
                  ---   Si lo meto aqui que es la nueva html creada no me funciona el scrip y eso es lo que me pasa en la web  y se supongo que esa html incluye ya el           *                   head de la prmera  <----     esto no es codigo                                  
<br>
Nombre: <?php echo $_POST["nombre2"];?>
<br>
Edad: <?php echo $_POST["edad2"];?>
<br>
</html>

SI meto el href de click2 dentro del html que quiero que me aprezca ( recibe-parametro2), deja de funcionar la 2 consulta ajax. Si lo dejo tal como esta aparecen los dos click aqui y funcionan.

[Heras7]

Es problema del JQUERY, esta solucionado con js de esta forma, epro es un poco chapuza

Código:

$(document).ready(function()
{
   $("#enlaceajax").click(function(evento)
   {
      evento.preventDefault();
      $("#destino").load("recibe-parametro.php", {nombre: "Pepe", edad: 45}, function()
	  {
         alert("recibidos los datos por ajax");
      });
   });
})
function que()
{
      $("#destino2").load("recibe-parametro2.php", {nombre2: "jose", edad2: 425}, function()
	  {
         alert("recibidos los datos por ajax");
      });
}

Y

Código:

<a href="#" id="enlaceajax2" onClick="que()">Haz clic! a 2</a>

Que si encontrais solucionarlo de la otra forma estaría muy agradecido =)