Affichage d'un lien dynamiquement dans ma navbar ??

Fermé
thekillerb313 Messages postés 126 Date d'inscription dimanche 16 mars 2014 Statut Membre Dernière intervention 13 janvier 2021 - 21 août 2020 à 08:16
jordane45 Messages postés 38144 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 avril 2024 - 26 août 2020 à 11:40
Bonjour :)

je développe un site sur drupal 8 où l'utilisateur dès qu'il arrive sur le site a 2 choix (boutons).
En fonction de ce qu'il aura cliquer j'ai un nouveau lien dans ma navbar qui s'ajoute.

Actuellement j'arrive à ajouter le lien (avec append() ) mais seulement le changement n'intervient que dans la page d'accueil et dès que je navigue sur les autres pages ma modifs s'en va.
Faut il utiliser un cookie ? Si oui comment je peux ça en place ?

5 réponses

jordane45 Messages postés 38144 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 avril 2024 4 650
21 août 2020 à 08:59
Bonjour
Oui, il te faut stocker l'information soit via un cookie soit via le localstorage.
Dans les deux cas tu trouveras de nombreux tutos sur le net pour le faire.

Et bien entendu, une fois l'information stockée, tu devras aller la lire sur chaque page pour recharger le lien dans ta navbar.
0
thekillerb313 Messages postés 126 Date d'inscription dimanche 16 mars 2014 Statut Membre Dernière intervention 13 janvier 2021
Modifié le 21 août 2020 à 11:26
Alors j'ai bien en place mon cookie mais lorsque je fais

  if (getCookie('cookieNegoce') == 'import') {
          $("#menu-univers").append('<li class="nav-item"> <a href="#" class="nav-link"> Négoce </a> </li>');
   } else {
        if (getCookie("cookieImport") == "negoce") {
            var element = document.getElementById('menu-univers'); 
            element.append("<li class='nav-item'> <a href='#' class='nav-link'>Import-Export</a></li>");
        }
  }


ça met code en dur au lieu de l'interpréter ?

0
jordane45 Messages postés 38144 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 avril 2024 4 650
21 août 2020 à 11:32
Re bonjour,

Déjà, pourquoi utiliser un coup l'écriture jquery.. et une autre fois le "pure" js ?
Ensuite, quel est le code html de ton "menu-univers" ?
As tu codé le site toi même ou passes tu par un cms ?

Quel est le code généré de cette page ( une fois la page de ton site affichée, faire un CTRL+u puis nous coller le résultat ) ?

Je suppose que tu utilise un framework tel que bootstrap....
Où as tu placé ton code js (celui que tu nous montres) par rapport au chargement de la lib bootstrap (ou autre framework) ?

Ton élément menu-univers .. c'est une div... ou bien c'est bien un UL ?
Car les LI se placent dans des UL ....
et dans ce cas, ça serait
$("#menu-univers > ul").append('<li ...
0
thekillerb313 Messages postés 126 Date d'inscription dimanche 16 mars 2014 Statut Membre Dernière intervention 13 janvier 2021
23 août 2020 à 13:18
<ul id="menu-univers" class="clearfix nav navbar-nav ml-md-auto">
<li class="nav-item">
<a href="/presentation" class="nav-link" data-drupal-link-system-path="node/9">Présentation</a>
</li>
<li class="nav-item">
<a href="/nos-services" class="nav-link" data-drupal-link-system-path="node/7">Nos services</a>
</li>
<li class="nav-item">
<a href="/page-actualites" class="nav-link" data-drupal-link-system-path="node/3">Actualités</a>
</li>
<li class="nav-item">
<a href="/contact" class="nav-link" data-drupal-link-system-path="node/8">Contact</a>
</li>
</ul>

Il s'agit bien d'un id placer dans mon ul pour ne pas l'ajouter dans les autres nav...
j'utilise Drupal 8 comme CMS.
0
thekillerb313 Messages postés 126 Date d'inscription dimanche 16 mars 2014 Statut Membre Dernière intervention 13 janvier 2021
Modifié le 26 août 2020 à 11:39
      //ACTION LORS DU CLIQUE SUR IMPORT
      $("#import").click(function(){
        //Supression COOKIE NEGOCE
        document.cookie = "cookieNegoce=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";

        //CREATION COOKIE
        var d = new Date();
        d.setTime(d.getTime() + (1 * 24 * 60 * 60 * 1000));
        var expires = "expires="+d.toUTCString();
        document.cookie = "cookieImport" + "=" + "import" + ";" + expires + ";path=/";
        jQuery('.modal').modal('hide');
      });

      //ACTION LORS DU CLIQUE SUR NEGOCE
      $("#negoce").click(function(){
        //Supression COOKIE IMPORT
        document.cookie = "cookieImport=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";

        //CREATION COOKIE
        var d = new Date();
        d.setTime(d.getTime() + (1 * 24 * 60 * 60 * 1000));
        var expires = "expires="+d.toUTCString();
        document.cookie = "cookieNegoce" + "=" + "negoce" + ";" + expires + ";path=/";       
        jQuery('.modal').modal('hide');
      });

        //GET COOKIE
        function getCookie(cname) {
          var name = cname + "=";
          var decodedCookie = decodeURIComponent(document.cookie);
          var ca = decodedCookie.split(';');
          for(var i = 0; i <ca.length; i++) {
            var c = ca[i];
            while (c.charAt(0) == ' ') {
              c = c.substring(1);
            }
            if (c.indexOf(name) == 0) {
              return c.substring(name.length, c.length);
            }
          }
          return "";
        }
        //CHANGEMENT DE LA NAVBAR SUR TOUTES LES PAGES
        void function chargementNavbar(){
          if (getCookie('cookieNegoce') == "negoce") {
            var element = document.getElementById('menu-univers'); 
            $(element).append('<li class="nav-item negoce"> <a href="#" class="nav-link">Négoce</a></li>' );
            console.log('function chargementNavbar cookieNegoce');
         
          } else {
           if (getCookie("cookieImport") == "import") {
            var element = document.getElementById('menu-univers'); 
            $(element).append('<li class="nav-item import"> <a href="#" class="nav-link">Import-Export</a></li>' );
            console.log('function chargementNavbar cookieNegoce');
          }
         }
        }();


Voici mon js pour modifier le contenu sur les pages.
Ma modal est sur ma page d'accueil la modif se fait sur les autres pages sauf ma page d'accueil lorsque je clique sur Negoce ça ne fait change rien faut attendre le 2eme clique sur la modal pour le voir apparaitre.
En gros ça fonctionne sur les autres pages sauf la page d'accueil où il y a ma modal.

Lorsque que je clique sur un bouton de ma modal, le modal se ferme bien mais faut que je refresh la page accueil pour voir l'ajout du link voulu...
Et c'est pour cela que ça fonctionne pour les autres il y a un clic donc un chargement
Je ne sais pas si je suis clair
0
jordane45 Messages postés 38144 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 avril 2024 4 650
26 août 2020 à 11:40
Au click, tu dois créer le cookie ET ajouter l'item à la navbar
là tu ne fais que créer le cookie.... donc l'item n'apparait que si tu réaffiches ta page
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
thekillerb313 Messages postés 126 Date d'inscription dimanche 16 mars 2014 Statut Membre Dernière intervention 13 janvier 2021
Modifié le 23 août 2020 à 13:40
J'essaye de refresh la page d'accueil après le choix mais comment executer une seule fois l'ouverture du modal ?
0