6 – Come Passare dei valori da una pagina all’altra

Se avete bisogno di mantenere dei valori al passaggio ad un’altra pagina, esistono due metodi che fanno al caso vostro.

Passaggio via indirizzo

Con questo metodo, i valori verranno salvati nel vostro indirizzo della pagina con la sintassi:
http://INDIRIZZO?variabile1=valore1&variabile2=variabile2&...

Per salvarli in questo modo è sufficiente utilizzare un form con metodo get:

Nome:


Cognome:


<form action=”http://www.cyberpills.net/6-come-passare-dei-valori-da-una-pagina-allaltra/”>
Nome:<br>
<input type=”text” name=”nome”>
<br>
Cognome:<br>
<input type=”text” name=”cognome”><br>
<input type=”submit” method=”get” value=”Invia”/>
</form>

Come potete vedere, quando premete “invia” nell’esempio sopra, si ricarica la stessa pagina (http://www.cyberpills.net/6-come-passare-dei-valori-da-una-pagina-allaltra/) (NB: dovreste, ovviamente, non mettere lo stesso indirizzo della pagina in cui siete, ma quello della pagina in cui volete andare, ma per questo esempio mi era comodo fare così) con di seguito i valori inseriti nei campi.

Per recuperare questi valori ci servono alcuni metodi e funzioni di javascript che ci permettono di controllare l’URL del documento e le stringhe:

  • window.location.search – Restituisce la parte dell’URL preceduta dal punto di domanda (‘?’ incluso) come stringa.
  • STRINGA.lenght – Aggiungere .lenght ad una stringa restituisce la sua lunghezza.
  • STRINGA.split(stringaSeparatrice).split(stringaSeparatrice) separa la STRINGA nei punti in cui appare la stringaSeparatrice e restituisce i risultati in un array.

Con questi tre metodi si può utilizzare il seguente script per ottenere i paramentri passati:

<script type=”text/javascript”>
var parametriURL=[];
var parametri={};
var vettore1=[];
var vettore2=[];

if (window.location.search.length > 0) {

vettore1 = window.location.search;
vettore1 = vettore1.split(“?”);
vettore1 = vettore1[1];
parametriURL = vettore1.split(“&”);

for(var i = 0; i < parametriURL.length; i++) {

vettore2 = parametriURL[i].split(“=”);
parametri[i] = vettore2[1];
}
}
</script>







Se ci sono dei parametri (cioè se la stringa coi parametri è più lunga di 0)…

Quattro operazioni consecutive:
Mette la stringa contenente i parametri in vettore1.
Separa vettore1 in due vettori, uno con ciò che precede il ? (cioè una stringa vuota) e l’altro col resto.
Elimina il primo elemento del vettore1 (quello con indice 0) e si tiene quello di indice 1.
Separa tutte le stringhe separate da & e le rimette nel vettore parametriUrl.

Per ogni elemento di parametriURL…

Prende l’elemento i-esimo, lo separa nel punto in cui c’è l’= e mette tutto nel vettore2.
Mette nel vettore parametri solo il valore del parametro.




Nel vettore parametri avrete tutto ciò che avete passato col metodo get.

Web Storage

Il web storage permette di salvare con delle funzioni delle stringhe in modo locale sul browser.
Il web storage permette due tipi di memorizzazione:

  • localStorage – salva permanentemente.
  • sessionStorage – cancella i dati alla fine della sessione ()quando si chiude il browser o la scheda).

Dato che le funzioni sono molto semplici, le elencherò di seguito con una breve spiegazione:

  • localStorage.setItem(nome,valore) – Salva permanentemente una stringa col nome “nome” a cui viene dato il valore “valore”.
  • sessionStorage.setItem(nome,valore) – Salva per la sessione corrente una stringa col nome “nome” a cui viene dato il valore “valore”.
  • avariabile=localStorage.getItem(nome) – Recupera il valore della variabile salvata permanentemente di nome “nome”.
  • avariabile=sessionStorage.getItem(nome) – Recupera il valore della variabile salvata per la sessione corrente di nome “nome”.
  • localStorage.removeItem(nome) – Rimuove la variabile salvata permanentemente in precedenza di nome “nome”.
  • sessionStorage.removeItem(nome) – Rimuove la variabile salvata per la sessione in precedenza di nome “nome”.
Please follow and like us: