Jquery Mobile- Creare semplice lista via ajax

[smartix]

Jquery Mobile- Creare semplice lista via ajax

Ciao!!
Dopo numerosi tentativi mi rassegno a creare questo post. Il problema è semplicissmo.
In una pagina di Jquery Mobile vorrei creare una normalissima lista (<ul><li>...</li></ul>) in modo dinamico via ajax tramite metodo LOAD(). Insomma: il codice della lista è in un file separato dalla pagina in cui viene richiamato. Tutto chiaro, vero?

PROBLEMA: I dati della lista vengono caricati, MA ad essi non viene applicato lo STILE jquery mobile. Cioè la lista appare come una normale lista creata con Microsoft Word per intenderci!!
Dopo alcune ricerche ho scoperto che bisogna usare una delle seguenti funzioni:

• .listview("refresh");
• .trigger("create");

Non riesco a capire come utilizzarle... ho fatto mille tentativi ma nulla funziona!!!!! Chiedo gentilmente il vostro aiuto

Ecco il semplice codice della pagina:
[HTML]
<!-- Sezione Head della pagina con link a tutti i file Jquery, Css etc. etc. -->

<!-- Body -->

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

<div data-role="header">
<h1>Pagina uno</h1>
</div>

<div id="data-container" data-role="content">
</div>

<script type="text/javascript">
$( "#data-container" ).load("http[://]link/file_lista.php");
</script>

<div data-role="footer">
<h4>Piè di pagina</h4>
</div>

</div>[/HTML]

Di seguito invece un semplice esempio del codice della lista che viene richiamato tramite load() e inserito nel div #data-container:
[HTML]
<ul data-role="listview">
<li><a href="#page2">Testo Primo Link</a></li>
<li>......</li>
</ul>
[/HTML]

[uses]

Ciao, Ho lo stesso problema e sto diventando matto. Alla fine ho scelto di non formattare l'elenco in Jquery Mobile. Volevo sapere se eri riuscito a trovare una risposta. Te ne sarei grato. Se vengo a conoscenza della soluzione ti aggiornerò.

[smartix]

Ciao!!
Per fortuna sono stato notificato dal forum tramite una mail di questo tuo messaggio
La buona notizia è che ero riuscito a capire come utilizzare le funzioni sopra citate ed avevo quindi creato una pagina funzionante.
La notizia cattiva è che (essendo materiale datato) devo andare a cercare il file in questione (nel frattempo ho cambiato pc e formattato).
Tuttavia abbi fiducia... credo proprio di riuscire a farlo saltare fuori.

Detto questo capisco molto bene il tuo stato d'animo... credimi. Quando ho letto il tuo messaggio ("sto diventando matto") non sono riuscito a trattenere una risata!! Conosco molto bene la frustrazione legata a questo specifico problema: varie ore passate invano a cercare una soluzione. Ero rimasto veramente sorpreso dal fatto che non ci fosse una spiegazione chiara e ragionevolmente breve nella documentazione di jquery mobile. Ma, essendo una risorsa gratuita, non si può che esser grati di quello che già viene dato. Tuttavia rimane il fatto che questo argomento è (per forza di cose) fondamentale per chiunque voglia creare un progetto un po' più complesso di qualche pagina statica... e quindi meriterebbe particolare attenzione (oltre a qualche esempio semplice ed essenziale)

[smartix]

Ciao!!
Dovrebbe essere questo... fai una prova al volo e fammi sapere.
Se è una versione vecchia/sbagliata, continuo a cercare.
[HTML]
<div id="data-container" data-role="content"></div>

<script type="text/javascript"> $("#data-container").load( "http...indirizzo_pagina.php", function(){ $("#data-container").trigger("create");});</script>[/HTML]

P.s. Visto che stai lavorando in jquery mobile, ti faccio una domanda: hai qualche bel template da consigliare (non importa se free o a pagamento) per un progetto in jquery mobile?

[uses]

Ciao,
Ti ringrazio veramente tanto della tua risposta. La tua soluzione può essere giusta in quanto segue lo stesso procedimento che mi ha portato alla soluzione del problema.
In particolare io ho risolto così:

// Aggiorno un div tabMappa mettendo dentro una tabella contenente dei pulsanti che eseguono un'azione
$('#tabMappa').html('Loading...').load('aspAjax.aspx', 'miei parametri', function () {

        // Al Termine del caricamento HTML dei Pulsanti da Ajax, associo l'evento click ai pulsanti
        $(".PulsanteDetVarco").bind("click", function () {
        });


        // Aggiorno tutti i Pulsanti inseriti con lo stile jqm 
       $('[type="button"]').button();

});

In questo sito trovi però tutti i riferimenti per l'aggiornamento di qualsiasi tipi di elemento.

Grazie ancora

[smartix]

Sono contento che tu sia riuscito a risolvere.
Solo due cose:

1. "In questo sito trovi però tutti i riferimenti per l'aggiornamento di qualsiasi tipi di elemento"... non vedo nessun link;
2. Per quanto riguarda i consigli per un template? (Vedi mio messaggio precedente)

[uses]

Ciao,
scusa per il link ma essendo un utente non premium non sono nella possibilità di inviare link
comunque il link che ti avevo indicato nel post precedente te lo ripropongo mancando solo della parte iniziale altrimenti mi impedisce di inviartelo.. spero capirai.. ed è questo:
gajotres.net/jquery-mobile-and-how-to-enhance-the-markup-of-dynamically-added-content/

Per il secondo punto devo dire che è solo un mese che sviluppo web app e i template erano l'ultimo dei miei problemi. La questione di cui sopra era veramente importante ma adesso penso di aver capito il meccanismo. Il tipo di applicazione che ho sviluppato è a supporto di un gestionale dunque la grafica non è molto importante per i miei clienti e devo dire che lo standard di jqm mi ha soddisfatto molto.
Però queste web app mi hanno veramente stupito e appassionato.. credo approfondirò l'argomento e se trovo qualcosa ti aggiornerò. Teniamoci aggiornati a presto
Max

[uses]

Ciao,
stavo spulciando tra gli argomenti trattati nel sito che ti ho girato e ho visto che tratta anche i template.
Guarda se ti può interessare.

TOP 10 BEST LOOKING FREE JQUERY MOBILE THEMES
".gajotres.net/top-10-best-looking-free-jquery-mobile-themes/" manca sempre la prima parte del link

a presto
Max