Usage du localStorage

Une fonction  permet d'afficher le contenu

Tous les valeurs des champs  sont stocké en local
This commit is contained in:
Yannick Francois 2018-10-08 23:49:04 +02:00
parent 0f6abfa7b9
commit affb5500e7
3 changed files with 79 additions and 69 deletions

View File

@ -1,6 +1,5 @@
<!doctype html>
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<meta name="referrer" content="same-origin">
@ -23,7 +22,7 @@
<p>Framadate est un service en ligne permettant de planifier un rendez-vous ou prendre des décisions rapidement et
simplement</p>
<a href="parametres.html" class="btn">C'est parti</a>
<a href="parametres.html" class="btn" id="startButton">C'est parti</a>
</section>
<section>
@ -36,6 +35,6 @@
</form>
</section>
<script src="script.js"></script>
</body>
<script src="script.js"></script>
</html>

View File

@ -1,4 +1,4 @@
<!doctype html>
<!DOCTYPE html>
<html lang="fr">
<head>
@ -19,15 +19,13 @@
<section>
<p>
Je m'appelle
<input name="nom" data-group="record" />
Je m'appelle <input name="nom">
et le titre de ce sondage
<select id="type_sondage" data-group="record">
<select id="type_sondage">
<option>classique</option>
<option>special dates</option>
</select>
est
<input name="titre" data-group="record"/>.
est <input name="titre">.
</p>
<p>
Si je devais le décrire pour les autres personnes, je dirais
@ -40,7 +38,7 @@
<a href="reponses.html" class="btn" id="next">Continuer</a>
</nav>
<script src="script.js"></script>
</body>
<script src="script.js"></script>
</html>

View File

@ -1,21 +1,34 @@
window.onload = () => {
if(localStorage.getItem('type_sondage') == null) {
localStorage.setItem('type_sondage', 'classique');
const debugStorage = () => {
for(var i = 0; i < localStorage.length; i++) {
let key = localStorage.key(i)
console.debug(key, " = ", localStorage[key])
}
}
console.debug(localStorage)
document.querySelectorAll('input').forEach((inputElement) => {
inputElement.addEventListener("change", () => {
localStorage[inputElement.name] = inputElement.value
});
});
let typeSondageElement = document.querySelectorAll("*[data-group='record']")
typeSondageElement.forEach((currentElement) => {
currentElement.addEventListener('change', function() {
const selectedType = this.options[this.selectedIndex].text;
localStorage.setItem('type_sondage', type_sondage);
if(selectedType == "classique") {
if(document.getElementById("type_sondage")) {
type_sondage.addEventListener('change', function() {
let typeSondage = this.options[this.selectedIndex].text;
if(typeSondage == "classique") {
localStorage.setItem('type_sondage', this.options[this.selectedIndex].text);
document.querySelector('#next').href = "reponses.html";
} else {
localStorage.setItem('type_sondage', 'dates');
document.querySelector('#next').href = "dates.html";
}
debugStorage()
})
}
if(document.getElementById("startButton")) {
startButton.addEventListener('click', function () {
localStorage.clear()
localStorage.setItem('type_sondage', 'classique');
});
}