[RESOLU] Plusieurs boutons "Copier dans le presse papier" sur une même page

11 janv. 2016, 11:57

Bonjour !

J'utilise un petit script js très pratique pour copier le contenu d'un textarea dans le presse papier :

<script>
$("#clickme").click(function(){
    $('#temptext').select();
    document.execCommand('copy');
});

</script>

Partie html/php :

Code : Tout sélectionner

<textarea id="temptext"> <?php echo $team['export'] ;?></textarea>

<div id="clickme"><img src="../img/utilitaire/copy.png"> Copier</div>

Ca fonctionne très bien s'il n'y en a qu'un seul sur ma page, mais malheureusement j'ai besoin que le nombre de "copier" varie en fonction de la page.
Le script est sur la page d'un utilisateur et permet de copier d'un clic une de ses "équipes", un membre peut en avoir 3 et le suivant 15...

Connaissant bien le php j'ai tenté de mettre un foreach sur le script, mais ca ne marche pas (et je pense que ce n'est de toute façon vraiment pas bon pour ma page).

Il y a sans doute une solution toute simple en js, par exemple en précisant la zone a sélectionner par rapport au bouton !
Mais n'y connaissant rien en JS je suis perdue et j'ai bien besoin d'un petit coup de main

Merci à vous !

11 janv. 2016, 14:12

Bonjour, si j'ai bien compris tu veux que le nombre de copie dépende un peux du profil or ici cela ne réagit qu'au click dans ta fonction javascript pourquoi ne pas mettre une boucle?

11 janv. 2016, 18:09

Oui le nombre dépend du profil.
Du coup comment tu ferais ca ? Une boucle dans le script js ?
Mais comment désigner les "paires" bouton/textarea ?

12 janv. 2016, 05:03

Ce que tu écris dans ton textarea provient d'un requête je vois que les infos sont différentes selon le textarea donc par rapport au nombre de ligne retourner tu sais ton nombre de textarea et bouton je ne sais pas comment est ta requête du coup? après ici pour créer dynamiquement les paires textarea et bouton une boucle est nécessaire, avec un id dynamique je pense moi j'aurai dans l'id du textarea

Code : Tout sélectionner

$i=0;
while(nombredetextareaaafficher){
<textarea id="temptext".$i> <?php echo $team['export'] ;?></textarea>
<div id="clickme"><img src="../img/utilitaire/copy.png"> Copier</div>
}
$i++

attention j'ai pas testé c'est juste une idée.

12 janv. 2016, 09:58

C'est ce que j'avais testé au début effectivement j’étais partie sur cette piste là.
Le bouton est dans un foreach donc pas de problème pour numéroter, mais comment je traduis ca dans mon script js ?

12 janv. 2016, 11:22

en mettant autre chose que temptext dans la ligne ;
$('#temptext').select();
en s'aidant de http://stackoverflow.com/questions/4823 ... d-an-event

12 janv. 2016, 21:04

Alors j'ai lu ce qu'ils disent sur ton lien, mais je connais vraiment rien en JS et je n'arrive pas à l'appliquer ... :/
Si j'ai bien compris il faut utiliser "this" qui désigne l'élément actif.

J'ai donc testé :

Code : Tout sélectionner

<script>
$("#clickme").click(function(){
    $(this.'#temptext').select();
    document.execCommand('copy');
});

</script>

Avec du coup mon textarea a l'intérieur de la div "clickme"

Code : Tout sélectionner

<div id="clickme">
<textarea id="temptext"> <?php echo $team['export'] ;?></textarea>

<img src="../img/utilitaire/copy.png"> Copier</div>

Mais ca me donne "<div id="clickme">" dans le presse papier ! Ce qui me fait bien penser que je dois pas encore tout avoir compris...

13 janv. 2016, 14:38

Ne trouvant pas la solution syntaxique en JS, j'ai bidouillé pour faire ca avec php en incluant le script dans le foreach, ca donne ca :

Code : Tout sélectionner

<?php $n_team = 0;?>
<?php foreach( $liste_team_aff as $team) { ?>
<?php $n_team++;?>

<!-- Début de ma ligne de tableau -->

...

<div id="clickme<?php echo $n_team ;?>">
<textarea id="temptext<?php echo $n_team ;?>"> <?php echo $team['export'] ;?></textarea>

<script>
$("#clickme<?php echo $n_team ;?>").click(function(){
    $('#temptext<?php echo $n_team ;?>').select();
    document.execCommand('copy');
});

</script>


<img src="../img/utilitaire/copy.png"> Copier</div>


<!-- Fil de ma ligne de tableau -->

<?php } ?>

Ce qui donne le résultat que je cherche, mais je pense réellement que c'est pas très propre et pas très optimisé...
Les profils membre avec 50 équipes, ca veut dire avoir 50 le script sur la page... N'auriez vous pas une meilleure solution ? :/

14 janv. 2016, 11:20

j'ai trouvé cela https://api.jquery.com/event.data/

14 janv. 2016, 18:18

Ah super c'est exactement ce qu'il me faut merci

Je passe en résolu du coup, merci !

[RESOLU] Plusieurs boutons "Copier dans le presse papier" sur une même page

Qui est en ligne