Copier <p> dans le presse papier

louisrgn · Message par **louisrgn** » 17 oct. 2021, 16:15

Bonjour,

Je travaille actuellement sur un projet qui génère du code VBA. Après que l'utilisateur ai renseigné les champs input, il clique sur "Créer" et cela génère un code VBA.

Une fois que celui-ci est fait, j'aimerai faire un fonction copier qui récupère le code généré, pour que l'utilisateur n'est plus qu'à le coller dans l'éditeur Visual Basic for Application.

J'ai essayé les méthodes document.execCommand("copy") et clipboard rien n'y fait

Pouvez-vous me dire comment récupérer dans le presse papier le contenu de la balise HTML suivante :

Code : Tout sélectionner

<p id="show_code_macro1"></p>

Sachant que cette balise est alimentée par le contenu issu de la fonction JS suivante :

Code : Tout sélectionner

        function InstertionColonnesMultiples() {
          let Valeur1Macro1 = document.getElementById("InputVal1macro1").value;
          let Valeur2Macro1 = document.getElementById("InputVal1macro1").value;
          let Valeur3Macro1 = document.getElementById("InputVal2macro1").value;
          if (typeof Valeur1Macro1 !== 'undefined' && Valeur1Macro1 && Valeur3Macro1) {
              document.getElementById("show_code_macro1").innerHTML = 
              '<div class="Pre"><span class="MotClef">Sub </span>' + 'InsertMultipleColumns()'  + '<br/>' 
              + '<span class="MotClef">Dim </span>i <span class="MotClef">As Integer</span>' + '<br/>' 
              + 'Range("' + Valeur1Macro1 + ':' + Valeur2Macro1 + '").Select' + '<br/>'
              + '<span class="MotClef">On Error GoTo </span>Last' + '<br/>'
              + '&nbsp;' + '<span class="MotClef">' + 'For</span> i = 1 <span class="MotClef">To</span> ' + Valeur3Macro1 + '<br/>' 
              + '&nbsp;' + '&nbsp;' + 'Selection.Insert Shift:=xlToRight, CopyOrigin:=xlFormatFromRightorAbove</span>' + '<br/>' 
              + '&nbsp;' + '<span class="MotClef">Next</span> i' + '<br/>'
              + 'Last: <span class="MotClef">Exit Sub</span>' + '<br/>'
              + '<span class="MotClef">End Sub</span></div>';
              swal("Tadaaamm", "Votre macro est prête !", "success");
          }
          else{
              swal("Oooups", "Vous avez oublié de saisir une ou plusieurs valeurs", "error");
          };
        }

Le code HTML dans son ensemble :

Code : Tout sélectionner

<!doctype html>

<html lang="fr">
  <head>
    <meta charset="utf-8">
    <title>Insererdescolonnes</title>
    <script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
  </head>

  <body>

      <header>
      </header>

    <main>
      <section id="content">
        <h3>Insérer des colonnes</h3>
        <p>Ce code vous permet de saisir plusieurs colonnes en un seul clic.<br>
            Vous devez simplement renseigné la colonne à partir de laquelle vous souhaitez ajouter d'autres colonnes et indiquer le nombre.</p>
        <label>Ciblez la colonne de départ</label><input type="text" placeholder="A" id="InputVal1macro1"><br>
        <label>Saisissez le nombre de colonnes à insérer</label><input type="text" placeholder="6" id="InputVal2macro1"><br>
        <p class="actions">
          <button onclick="InstertionColonnesMultiples()" class="button special">Créer</button>
          <button onclick="copier()" class="button special icon fa-copy">Copier</button></p>
          <p id="show_code_macro1"></p>
      </section>
    </main>

    <footer>
    </footer>

      <script>
        function InstertionColonnesMultiples() {
          let Valeur1Macro1 = document.getElementById("InputVal1macro1").value;
          let Valeur2Macro1 = document.getElementById("InputVal1macro1").value;
          let Valeur3Macro1 = document.getElementById("InputVal2macro1").value;
          if (typeof Valeur1Macro1 !== 'undefined' && Valeur1Macro1 && Valeur3Macro1) {
              document.getElementById("show_code_macro1").innerHTML = 
              '<div class="Pre"><span class="MotClef">Sub </span>' + 'InsertMultipleColumns()'  + '<br/>' 
              + '<span class="MotClef">Dim </span>i <span class="MotClef">As Integer</span>' + '<br/>' 
              + 'Range("' + Valeur1Macro1 + ':' + Valeur2Macro1 + '").Select' + '<br/>'
              + '<span class="MotClef">On Error GoTo </span>Last' + '<br/>'
              + '&nbsp;' + '<span class="MotClef">' + 'For</span> i = 1 <span class="MotClef">To</span> ' + Valeur3Macro1 + '<br/>' 
              + '&nbsp;' + '&nbsp;' + 'Selection.Insert Shift:=xlToRight, CopyOrigin:=xlFormatFromRightorAbove</span>' + '<br/>' 
              + '&nbsp;' + '<span class="MotClef">Next</span> i' + '<br/>'
              + 'Last: <span class="MotClef">Exit Sub</span>' + '<br/>'
              + '<span class="MotClef">End Sub</span></div>';
              swal("Tadaaamm", "Votre macro est prête !", "success");
          }
          else{
              swal("Oooups", "Vous avez oublié de saisir une ou plusieurs valeurs", "error");
          };
        }

        function copier() {
          swal("Copié", " ", "success",{
          buttons: false,
          timer: 1000,
          });
        }

      </script>

  </body>
</html>

Merci par avance du temps que vous prendrez pour contribuer à mon projet

bien cdlt,

louisrgn

Message par **webmaster** » 18 oct. 2021, 10:12

Bonjour,

Le copy doit être fait après la sélection
Voici la bonne fonction (issue du script de mon livre https://www.toutjavascript.com/livre/sc ... p?url=copy)

Code : Tout sélectionner

        function copier() {
          var elt=document.getElementById("show_code_macro1");
          /* Création de la sélection par programmation de Range */
          var sel=window.getSelection();
          var range=document.createRange();
          range.selectNodeContents(elt);
          sel.removeAllRanges();
          sel.addRange(range);
          /* Copy in the clipboard */
          document.execCommand("copy");
          /* Animation css flash sur l'élément container parent */
          elt.parentNode.className="container flash";
          /* Effacement de la sélection */
          range.collapse();


          swal("Copié", " ", "success",{
          buttons: false,
          timer: 1000,
          });
        }

louisrgn · Message par **louisrgn** » 18 oct. 2021, 10:31

bonjour Webmaster,

C'est super ca marche très bien !

bonne journée à toi,
cdlt

Forums Tout JavaScript

Copier <p> dans le presse papier

Copier <p> dans le presse papier

Re: Copier <p> dans le presse papier

Re: Copier <p> dans le presse papier