11521 sujets

JavaScript, DOM et API Web HTML5

Copier le contenu d'un div en gardant la forme + variables php

Bonjour à tous,

Actuellement en train de réaliser un site web dynamique je me retrouve face à 2 petits problèmes. Mon niveau en javascript n'étant pas suffisant je fais appel à vous.
Voici mon code (j'ai enlevé les parties inutiles): 
<html><?php
    session_start();
    if($_SESSION['username'] !== ""){ $user = $_SESSION['username'];}
    $s_a_d = isset($_POST['s_a_d']) ? $_POST['s_a_d'] : NULL;
    $s_a_d = nl2br($s_a_d);
?>

<body>
    <div id="nouveauTicket" style="display: inline-block;  margin: auto; float: right; width: 8%;">
        <form method="post" action="principale.php"><input class="bouton_gen_ticket" type="submit" value="+ Nouveau ticket" style="width: 100%%; height: 30px;"></form>
        <button id="bouton" class="bouton_gen_ticket" type="submit" style="width: 100%%; height: 30px;">Copier le ticket</button>
    </div>
    <!-- Création du bouton pour faire un nouveau ticket -->
    <div id="nouveauTicket" style="display: inline-block;  margin: auto; float: right; width: 8%;">
        <form method="post" action="principale.php">
            <input class="bouton_gen_ticket" type="submit" value="+ Nouveau ticket" 
               style="width: 100%%; height: 30px;">
        </form>
    </div>

    <!-- Affichage du ticket -->
	<div id="content" style="display: inline-block; border-style: solid; border-color: black; border-width: 2px; width: 30%; margin: auto; float: left; margin-left: 35%">
        <?php
        echo "&nbsp;<a style='font-size:15px; font-weight: bold'>Autre demande de service</a>
        <br/><br/>&nbsp;• Description de la demande : <br/>" . $s_a_d . "<br/><br/>";
        ?>
    </div>
</body>
</html>






Et voici ma fonction js :
<script>
    var bouton = document.getElementById('bouton');

    bouton.addEventListener('click', function() {
        var entire_text = "";
        var text;
        for (let i = 0; i < 100; i++) {
            text = document.getElementById("content").children[i];
            if (text == undefined) break;
            if (text.tagName == "BR") {entire_text += '\n'; continue;}
            console.log(text);
            entire_text += String(text.innerHTML);
        }
        console.log(entire_text);

        navigator.clipboard.writeText(entire_text).then(function() {
            console.log('success')
        }, function() {
            console.log('failed')
        });

        return false;
    });
</script>



Mon objectif et de créer un bouton qui puisse copier le texte qui se trouve dans le <textarea> mais j'ai 2 difficultés : 1) Je n'arrive pas à copier les variables PHP
2) J'aimerais garder le format d'écriture (mais comme cela copie dans le
presse-papier cela enlève tout Smiley ohwell )

Si vous avez des idées je vous en serais très reconnaissant.
Merci beaucoup et bonne journée Smiley smile
Modifié par Gwaka (01 Jul 2019 - 12:15)
Hello

pour dupliquer du contenu, tu peux utiliser en jquery la méthode clone()
Je te laisse explorer l'api Smiley cligne
Modifié par Pedrothelion (05 Jul 2019 - 09:38)
Modérateur
Attention, session_start doit être appelé avant que quoi que ce soit ne soit transmis au navigateur, donc ton fichier devrait commencer ainsi (et non l'inverse):

<?php
    session_start();
    // autres commandes
?>
<html>


Concernant ta question, le contenu du presse papier est associé a un type mime, ce qui permet aux applications de réagir différemment au collage selon le contenu (image, texte brut, texte mis en forme, etc.)
Utiliser writeText force le type à être texte brut. Il faudrait passer par la méthode write de Clipboard, mais seul Firefox l'implémente à l'heure actuelle.

Pour le support dans Chrome, il faut passer par la vieille méthode, sélectionner les éléments, déclencher la copie avec execCommand, et éventuellement intercepter l'évènement pour changer le type.
Sujet clos
Aller à