2011-11-23 4 views
17

Sto provando a passare alcuni parametri a un id di pagina creato in jQuery Mobile.Passare parametri a un id di pagina in jQuery Mobile

Il sito è composto da list-vista con collegamenti, ognuno di loro ha l'hash codificato in esso, come questo:

<li><a href="#pronostico?region=12&ciudad=0">Puerto Natales</a></li> 

ho binded pagebeforechange per catturare gli hash nell'URL, fare il rilevamento dei parametri e agire in base alla quantità di parametri passati.

Ora, con i biscotti, ho provato questo:

$(document).one("pageinit", function(event, data) { 
    if (location.hash.search(/^(#ciudades|#pronostico)/) === -1) { 
    if ($.cookie("recordar")) { 
     $.mobile.changePage($("#pronostico"), { 
     data: "region=" + $.cookie("region") + "&ciudad=" + $.cookie("ciudad") 
     }); 
    } 
    } 
}); 

Ma appena mi passa alla pagina di #pronostico-id, senza parametri nella hash. Di conseguenza, ottengo una pagina senza le informazioni che dovrebbe mostrare.

Grazie in anticipo.

risposta

31

Sì, i parametri dell'hash non sono supportati per impostazione predefinita. Sto usando il seguente plugin per darmi questo, e sta lavorando abbastanza bene finora ;-)

jqm.page.params

AGGIORNAMENTO - MODO D'USO:

Ho aggiunto il seguente codice dopo aver incluso jqm.page.params.js:

$(document).bind("pagebeforechange", function(event, data) { 
    $.mobile.pageData = (data && data.options && data.options.pageData) 
     ? data.options.pageData 
     : null; 
}); 

Così, per esempio, una pagina sempre chiamato come:? index.html # ricerca id = mysearchkeyword ora è possibile accedere a queste informazioni, in ogni caso mi sento come pagina:

$(document).on("pagebeforeshow", "#firstpage", function(e, data){ 
        if ($.mobile.pageData && $.mobile.pageData.id){ 
            console.log("Parameter id=" + $.mobile.pageData.id); 
        } 
 }); 

Stampa "mysearchkeyword" sulla console di registrazione.

Spero che questo aiuti!

PS: Si noti che non sono un modo affiliato con il plugin o è autore

Nota dell'Editore: L'autore ha avuto questo come secondo blocco di codice. In Jquery 1.9, live è rimosso, quindi ho aggiornato il suo esempio sopra con una sintassi .on invece. Ecco l'originale:

+0

Questo sembra utile, e penso che avrò bisogno dei tuoi campioni per sapere come funziona. Dovrei cambiare il 'pagebeforechange' che ho implementato nel mio sito quando uso questo plugin? – noquierouser

+0

il mio codice di esempio aggiunto come aggiornamento sopra, segno di pls come risposta se questo funziona per voi! Grazie – Leon

+0

Ho avuto un problema simile e ho trovato questa risposta molto utile. http://stackoverflow.com/questions/10354455/jquery-mobile-url-parameter-not-updating-in-browser-but-getting-correct-one-wit –

2

Il plug-in non supporta i segnalibri. Se si aggiunge un gestore pagechange, è possibile correggere che mettendo i params indietro sulla url dopo jQm è fatto con esso:

// list of inner pages where you want to support params AND bookmarking 
// maybe better to use a CSS class name to mark them 
var $paramPages; 
$(document).ready(function() { 
    $paramPages = $('#book, #order'); 
}); 

// put the params back into the location once jQM is done 
// 
$(document).bind("pagechange", function(e, data) { 
    if (data.toPage.is($paramPages) && data.absUrl) { 
     window.location.replace(data.absUrl); 
    } 
}); 
0

Sembra un modo per ottenere il passaggio di parametri URL tra le pagine è quello di utilizzare l'hash approccio di trasformazione in questo esempio dalla documentazione jQuery mobile: http://demos.jquerymobile.com/1.4.1/navigation-hash-processing/

questa soluzione sembra ideale perché, a differenza di altre soluzioni, aggiorna l'URL nella barra degli indirizzi del browser per includere i parametri URL su di cambiare tra le pagine. Questo approccio elimina anche la necessità di utilizzare qualsiasi plugin come 'jqm.page.params'.