[BootStrap] Utilser des toasts
Bonjour,
Actuellement en plein développement d'une application web je me suis dirigé pour la premiere fois vers Bootstrap pour mon Design.
J'ai actuellement besoin de notifier mes utilisateurs à leur premiere connexion qu'ils doivent changer leur mot de passe car j'en envoie un aléatoirement par mail, je veux donc faire ça avec un Toast de Bootstrap mais celui ci ne s'affiche pas voici mon code
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
| function premiereConnexion(){
$req = bdd()->prepare('SELECT connexion_utilisateur FROM utilisateurs WHERE id_utilisateur = :id');
$req->execute(array('id' => $_SESSION['profil']['id']['utilisateur']));
$result = $req->fetch();
if($result['connexion_utilisateur'] == 0){
?>
<div role="alert" aria-live="assertive" aria-atomic="true" class="toast" data-autohide="false">
<div class="toast-header">
<img src="..." class="rounded mr-2" alt="...">
<strong class="mr-auto">ECSG</strong>
<button type="button" class="ml-2 mb-1 close" data-dismiss="toast" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="toast-body">
C'est votre premiere connexion il est temps de changer de mot de passe !<br>
Cette action sera toujours possible sur votre profil.<br><br>
Par sécurité un mail de confirmation vous sera envoyé
<form>
<div class="form-group">
<label for="exampleInputEmail1">Nouveau mot de passe</label>
<input type="password" class="form-control" id="exampleInputPassword1" aria-describedby="emailHelp" name="mdp">
<small id="emailHelp" class="form-text text-muted">Ne divulguez jamais votre mot de passe.</small>
</div>
<div class="form-group">
<label for="exampleInputPassword1">Password</label>
<input type="password" class="form-control" id="exampleInputPassword1" name="mdpConf">
</div>
<button type="submit" class="btn btn-primary">Modifier</button>
</form>
</div>
</div>
<?php
}
} |
Et pourtant je pense avoir bien importé tout mes fichier js,jquery et css dans mon entete :
Code:
1
2
3
4
5
6
7
| <link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<script type="text/javascript" src="script/bootstrap.js"></script>
<script type="text/javascript" src="script/bootstrap.bundle.js"></script>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<script src="jquery.toaster.js"></script> |
Merci d'avance pour votre aide !:hola::rire:
