Ayuda con Seleccion elemento de una lista

[n_e_o1981]

Hola,

Muy buenas, este es mi primer post aqui en este foro y espero que me acojais con "cariño" jajaj. Soy novato al maximo asi que tened paciencia conmigo, muchas gracias antes de empezar.

Mi pregunta es la siguiente..

Vamos a ver tengo varios elementos dentro de una lista <UL> , estos elementos los saco desde una base de datos que accedo atraves de PHP.
Cada elemento de la lista tiene un link <a href> hacia otro sitio de la misma pagina(#detalle), todos los elemenos hacia el mismo sitio.

Mi pregunta es, como puedo saber los datos del elemento que ha sido clickado para sacar sus detalles.

Es decir si tengo 3 elementos, cada uno con su imagen, nombre y precio y quiero sacar detalles de ese elemento, como se cual ha sido clickado para consultar sus datos en la base de datos???

No se si me he explicado con mucha claridad, espero que si, si no comentadme que necesitais para ayudarme

Muchisimas gracias

Un saludo

[quinqui]

Holas n_e_o1981, y bienvenido ^_^

Sobre tu pregunta, para recuperar los datos del elemento clickado, primero debes asignarle un ID único a cada uno de ellos. Algo como:

Código PHP:

   // Parte del script PHP que genera tu lista
  print" <ul>\n";
  while ($temp = mysql_fetch_array($sql))
 {
  // poniéndose en el caso que los elementos tienen un ID y un Nombre: 
   print'  <li id="elemento'.$temp['id'].'" onclick="tuFuncion(this.id)">'.$temp['nombre'].'</li>\n';
 }
  print" </ul>\n";  
   

Luego tienes que rellenar el contenido de la funcion Javascript "tuFuncion()", que será la que tomará los datos del elemento y los usará según tus requerimientos. Esta función debiera ir en HEAD de tu página (sea en directo o llamada como archivo independiente).

Código HTML:

function tuFuncion(id)
{
  var nombre = id.innerHTML; // esto lo tengo en duda, pero es para hacerte la idea...
  alert(nombre);
}

Cuando ves el html generado, la lista sería algo como:

Código HTML:

<ul>
 <li id='elemento1' onclick="tuFuncion(this.id)">Elemento No. 1</li>
 <li id='elemento2' onclick="tuFuncion(this.id)">Elemento No. 2</li>
 <li id='elemento3' onclick="tuFuncion(this.id)">Elemento No. 3</li>
</ul> 

La idea es que cuando haces click sobre el elemento de la lista, aparecerá una ventana de mensaje con el Nombre del elemento seleccionado...
Todo esto es teoría, no he probado nada de lo escrito, pero es para hacerte un esquema mental más o menos de cómo agarrar el asunto...

Espero que sirva ^^U

[kaS_aPPeaL]

Como muy bien dice quinqui, debes asignar un ID único a cada elemento.

Si no estás muy puesto en JavaScript, también lo puedes hacer utilizando una página php a modo de "ficha de elemento". Ejemplo:

En el listado, haces esto (te lo pongo con el código de quinqui):

Código PHP:

   // Parte del script PHP que genera tu lista
  print" <ul>\n";
  while ($temp = mysql_fetch_array($sql))
 {
  // poniéndose en el caso que los elementos tienen un ID y un Nombre: 
   print'  <li"><a href="ficha_elemento.php?id='.$temp['id'].'">'.$temp['nombre'].'</a></li>\n';
 }
  print" </ul>\n";  
   

Y luego en la página ficha_elemento.php:

Código PHP:

  <?
if (isset($_GET['id'])) {
  $sql = "select * from elementos where id = '$id';";
.....
}
?>   

Y seguido de eso pintas los resultados del elemento.

[n_e_o1981]

Muchas gracias por vuestra ayuda.

Os comento:

El tema es el siguiente, con lo que me habeis dicho vosotros tengo en $id el nombre del elemento de la lista, hasta aqui correcto, el problema viene cuando en lugar de cargar otra pagina tengo que ir a una parte de la misma, es decir

mi codigo es el siguiente:
print ("<li><a href=\"index.php#detalle?id=$resultado[lk_ph]\"></a></li>


y mas abajo tengo

print ("<div id=\"detalle\" class=\"panel\" title=\"Detalles\">");

que es donde tengo que ir al hacer click en uno de los elementos de la lista

y el problema que tengo ahora es que no me va a ese link, en el browser del navegador carga "" index.php#detalles?id=loquesea "" pero no me entra en los detalles y no se pq, alguna idea??


Gracias de nuevo

Un saludo

[quinqui]

Holas n_e_o1981

El problema es que has puesto el ancla antes de las variables:

Código PHP:

  <?
print ("<li><a href=\"index.php#detalle?id=$resultado[lk_ph]\"></a></li>");
?>   

Y debiera ser algo como:

Código PHP:

  <?
print ("<li><a href=\"index.php?id=".$resultado[lk_ph]."#detalle\"></a></li>");
?>   

Revisa este link para conocer mejor la forma en que armamos las URLs: http://es.wikipedia.org/wiki/URL#Sin....C3.A9rica_URL