SessionStorage retrieve data from an object with multiple keys HELP ! PLEASE

JavaScript
1

Hello,
I record using sessionStorage the data of a form, it is about adding new restaurants. I get the data from the form but I would like to retrieve the data for each restaurant in form restaurant name, address, notice, I created a restaurant object class, because I think it is necessary … but I do not know not how to do …
I manage to get the data of each key in block of the style for the notes of all the restos: 1,4,5,5,1,4,1 with the function forEachKey, but not the data of each key, address, note, comment of each restaurant;
Basically I would like to recover for each restaurant:
Name of the restaurant
address
note
comment

I have to store them just the time of the visit to the site, the loading of the page everything must be erased … because I must add restaurants in a fictitious way …
I used sessionStorage because I do not master the php yet.
I would like to display the data after form validation in a list of restaurants retrieved with google places API.
Can someone help me please, I need your lights !!!
THANK YOU !!

'<div id="newRestaurant"><h4>Ajouter un Restaurant</h4><form id="addNewRestaurant"><label>Nom du restaurant</label><br><input type="text" name="newName" id="newName" required><br><label>Adresse</label><br><input type="text" name="newAddress" id="newAddress" required><br><input type="submit" id="submitNewRestaurant"></form></div>';
<form id="review_form">
<h3 class="italic">Souhaitez-vous ajouter un avis sur ce restaurant?</h3>

<label>Combien d'étoiles donnez vous :</label><br>
<p id="numberstars"</p>

<select name="numberstars"id="numberstars">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select><br>

<div id="position"></div>
<label>Votre Commentaire :</label><br>
<textarea name="fullcomment" id="fullcomment"></textarea><br>
<input type="submit" id="submitbtn">
</form>
<script>
class Restaurant{
constructor (nom,adresse){
console.log(this);
this.nom=newName;
this.adresse=newAddress;
this.avis=[];
}
ajouterAvis(avis){
if(avis instanceof Avis){
this.avis.push(avis);
}
}
}
class avis{
constructor(note,commentaire){
console.log(this);
this.note=note;
this.commentaire=comment;
} 
}
// function forEachKey() {

// for (var i = 0; i < sessionStorage.length; i++) {
// console.log(sessionStorage.getItem(sessionStorage.key(i)));
// }
// }

//--------------------------------------------------------------------------	
names = JSON.parse(sessionStorage.getItem('nom') || "[]");
addresses= JSON.parse(sessionStorage.getItem('adresse') || "[]");
document.getElementById('submitNewRestaurant').onclick =function (saveData) {

var data = document.getElementById('newName').value;
names.push(data);
sessionStorage.setItem('nom', JSON.stringify(names));

var data = document.getElementById('newAddress').value;
addresses.push(data);
sessionStorage.setItem('adresse', JSON.stringify(addresses));

};

views = JSON.parse(sessionStorage.getItem('commentaire') || "[]");
notes = JSON.parse(sessionStorage.getItem('note') || "[]");
document.getElementById('submitbtn').onclick =function (saveData) {

var data = document.getElementById('fullcomment').value;
views.push(data);
sessionStorage.setItem('commentaire', JSON.stringify(views));

var data= $('#numberstars option:selected').text();
sessionStorage.setItem('note',data);
sessionStorage.setItem('note',JSON.stringify(data));
notes.push(data);
sessionStorage.setItem('note', JSON.stringify(notes));
};
</script>
2

One thing I notice just looking at your code is that your constructors have arguments but they are not properly used. Same for the saveData arguments in the onclick functions you define.

class Restaurant{
  constructor (nom,adresse){
    console.log(this);
    this.nom=newName;
    this.adresse=newAddress;
    this.avis=[];
  }
}

Should be

class Restaurant{
  constructor (nom,adresse){
    console.log(this);
    this.nom=nom;
    this.adresse=adresse;
    this.avis=[];
  }
}

If this is not clear for you I would recommend reviewing the section about object oriented programming.

1 Like
3

Ok thank you X140hu4 !