sito one-page con div nascosti - problema refresh e url

Buonasera,

ho creato un sito one-page, con div nascosti per le tre voci di menu presenti. I problemi che però ho riscontrato sono due:

- Al refresh della pagina, ovviamente si ricarica il contenuto iniziale e non lo stato dopo il "click" della voce di menu.

A questo proposito ho tentato di risolvere con ajax, ma non ho trovato nulla di efficace per il mio caso specifico.

- Il secondo punto è l'url. Ho provato a usare le history api html5, ed effettivamente riesco a manipolare l'url, ma qui il

problema del refresh peggiora, in quanto l'url modificata non corrisponde ad una pagina realmente presente (che

comprendo sia sbagliato già concettualmente) e quindi mi restituisce un'ovvia schermata di pagina che non esiste.

In sostanza il risultato che vorrei ottenere è di modificare l'url senza incappare nel problema sopracitato, e soprattutto di permettere un refresh della pagina che faccia visualizzare il contenuto della sezione cliccata e non di nuovo la home page.

Ringrazio anticipatamente per disponibilità,


Mirko

[karl94]

Dipende da che tipo di URL vuoi usare: se sfrutti le parti query o fragent identifier di quest'ultimo (rispettivamente, le parti dopo il punto interrogativo e il cancelletto) non ti serve alcun adattamento lato server.
Se invece vuoi un URL più tradizionale puoi ricorrere al RewriteEngine, configurandolo appropriatamente mediante il file .htaccess.
Quando le History API non erano ancora supportate i grossi siti come Facebook e Twitter sfruttavano il fragment identifier, usando URL come https://twitter.com/#!AlterVista.

In realta il sito non contiene php ne alcun linguaggio lato server. Il problema è che non comprendo, tra l'altro, l'utilità di manipolare l'url con le history api se poi al refresh la pagina non la trova...
Con gli hash il problema è lo stesso, la pagina la ricarica, ma l'home page, non la porzione visualizzata dall'evento click sull'ancora.

[NLSweb]

Scusa se mi intrometto... ma il reload della pagina serve alla sua funzione di ricaricare tutto il sito , quindi di eseguire un 'reset' diciamo..

tu dici che hai dei div nascosti che vuoi aggiornare con (presumo) contenuti dinamici ..
se cio' che ho compreso e' corretto forse la soluzione la trovi in questo post

In realtà no... mi pongo il problema di un reload volontario o accidentale da parte dell'utente.

[karl94]

Con gli hash il problema è lo stesso, la pagina la ricarica, ma l'home page, non la porzione visualizzata dall'evento click sull'ancora.

È responsabilità del tuo script di controllare al momento del caricamento l'URL, e di visualizzare di conseguenza il contenuto indicato.

[NLSweb]

In realtà no... mi pongo il problema di un reload volontario o accidentale da parte dell'utente.

Per Firefox esiste onbeforeunload che controlla l'evento UnLoad della Pagina
ma non credo sia compatibile per Chrome ....

domanda ? ma per caso apri una sessione utente ( cioe' login al sito ) per accedere ai contenuti ..
o e' aperto a tutti ...

è un sito one-page con div nascosti.... che appaiono con un evento .click

Per Firefox esiste onbeforeunload che controlla l'evento UnLoad della Pagina
ma non credo sia compatibile per Chrome ....

domanda ? ma per caso apri una sessione utente ( cioe' login al sito ) per accedere ai contenuti ..
o e' aperto a tutti ...

è aperto a tutti

[NLSweb]

Per ora mi viene in mente come soluzione quella di creare dei cookie dove registri la condizione di rispristino della pagina in caso di reload
Al primo avvio il coockie non e' presente , quindi avrai un comportamento classico , poi come l'utente attiva dei div , quindi registri le azioni nel coockie con una data/time di scadenza breve ; nel caso di reload controlli la presenza di cookie non scaduti , li leggi e riposizioni il div.

[karl94]

Per ora mi viene in mente come soluzione quella di creare dei cookie dove registri la condizione di rispristino della pagina in caso di reload
Al primo avvio il coockie non e' presente , quindi avrai un comportamento classico , poi come l'utente attiva dei div , quindi registri le azioni nel coockie con una data/time di scadenza breve ; nel caso di reload controlli la presenza di cookie non scaduti , li leggi e riposizioni il div.

Un sistema di questo tipo però non permetterebbe la condivisione dell'URL, e la navigazione su più schede confonderebbe il sistema.
La cosa più semplice è usare l'URL modificato per determinare lo stato della pagina.

[NLSweb]

karl94 ha ragione (..mi fa sempre molto piacere apprendere e comprendere a fondo le tecniche ed i linguaggi IT.. grazie !)

.. quindi quando l'utente attiva un DIV , si modifica URL con fragent identifier
nel momento che viene eseguito un relaod , il JS legge URL :
- nel caso non ci siano identificatori , caricara normalmente
- nel caso legga degli identificatori , bastera' fare un controllo per associare ad ogni identificatore lo stato precedente al reload ; quindi attivare i relativi DIV o elementi del caso.

una domanda : eseguendo questo sistema ripristiniamo l'aspetto , ma gli eventuali dati inseriti dall'utente (tipo form ad esempio) non possono essere recuperati , vero ? [ escludendo un eventuale login cliente che memorizza i dati sul server ]

[karl94]

una domanda : eseguendo questo sistema ripristiniamo l'aspetto , ma gli eventuali dati inseriti dall'utente (tipo form ad esempio) non possono essere recuperati , vero ? [ escludendo un eventuale login cliente che memorizza i dati sul server ]

Esatto, ma questo è il comportamento che un utente si aspetterebbe dopo un aggiornamento della pagina od un copia ed incolla dell'URL.

Interessante come soluzione... potreste farmi un esempio pratico di come effettuare questo controllo su un fragment?

Nel frattempo grazie per l'idea.

[NLSweb]

ho creato questo piccolo esempio

sai hai dubbi , chiedi pure..