2011-09-17 15 views
5

Estoy construyendo una aplicación html5 para trabajar usando Jquery Mobile que se compilará como una aplicación con phonegap más adelante.Jquery Mobile, accediendo a la página de detalles de la lista (datos dinámicos)

La aplicación carga una lista de elementos primero de un archivo json incluido pero luego de una url externa (comprueba si se deben agregar nuevos elementos a la lista) y la inserta en el sql-db incorporado en la versión moderna html5-navegadores.

Hasta ahora lo tengo funcionando. También lo tengo sacando los datos y presentándolos en una lista. Sin embargo, el siguiente paso me tiene un poco perplejo. Cuando un usuario hace clic en un elemento de la lista, debe abrir una página con la información sobre ese elemento, tomada de la base de datos.

Normalmente trabajo en php y ahí es, por supuesto, fácil de hacer. Simplemente agregue una variabel a la url con la identificación y luego obtenga la cadena de consulta y utilícela en el código php.

¿Alguien tiene una buena idea de cómo hacerlo mejor en JQuery Mobile? Una idea que tengo es simplemente usar el almacenamiento local y hacer un evento de clic que almacena un id en el almacenamiento local y luego usarlo en la página de detalles. Se siente como si debe haber una mejor manera, aunque ...

Respuesta

3

como un esquema que tendría en el DOM de una página sentados alrededor llamados detalles

<div data-role="page" id="details"> 
</div> 

generar los elementos de la lista con un atributo de datos que contiene html5 el identificador único en el vínculo de anclaje

<li><a href="#details" data-uid="1" class="detailslink">Your list item</a></li> 

enlazar un evento de clic que los puestos a una página que agarra los contenidos detalles, plop en la página de detalles y mostrar la página de detalles

$('.detailslink').bind('click', function(e){ 
    var id = $(this).data('uid'); 
    $.post('urltophp', {'id': id}, function(data){ 
     $('#details').html(data); 
    } 
}); 
Cuestiones relacionadas