Créé en 2021 et modifié le 23 Jan 2022

Créé en 2021 et modifié le 23 Jan 2022

JavaScript

–JS–
–JQ–
–classe JS–
–session storage–

 

Ressources

On top of the previous ones, on this site JS 

 

 

Part 1 – Management of the users

  • Add a user table to the database, with email, password and registration date.
  • Add at least 3 users.
  • Check the user exists in the database by modifiying verification.php.  The following code may inspire you.
$sql = "SELECT count(*) as total FROM utilisateur WHERE login=:login AND mdp=:mdp";
$resultats = $dbh->prepare($sql);
$login = "login";
$mdp = "mdp";
$resultats->bindParam(":login", $login);
$resultats->bindParam(":mdp", $mdp);
$resultats->execute(); 
$row= $resultats->fetch(PDO::FETCH_ASSOC);

echo var_dump($row);
echo $row["total"];
  • Only allow connected users to use the application

 

Part 2 – Discover JavaScript

  • Create a file function.js which displays ‘hello’ on the screen and the console. Include this file in index.php. To see the resultat, right click ->examine element->console
console.log("Hello");

  • Create a page inscription.php which allows to add a user using today’s date.
  • Add the cdn of Jquery on the registration page

  • Allo to display the login in Javascript when validating the form
<!DOCTYPE html>
 <html>
 <head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
</head> 

 <body>
<input type="text" id="nom" value="waza">
 </body> 

 <script>
 $(document).ready(function(){ var nom= $( "#nom" ).val(); alert(nom); });
</script>
</html>
  • Propose to register or to connect on the page index.html

 

Part 3 – Classes and session

  • Define a user class in JavaScript in user.js
  • During the registration, save the new user as an objet and display in console
  • Save it in sessionStorage 
class Fruit{
  constructor(couleur, grammes) {
    this.couleur= couleur;
     this.grammes= grammes;
  }
  
  get kilo(){
    return this.grammes/1000;
  }
}
let monFruit = new Fruit();
console.log(monFruit.kilo);