Discussion :

[wisefun77]

Bonjour,
J'ai un code en JavaScript qui copie du texte dans une textarea.
Quand l'user clique sur le bouton " Copier le texte", cela ouvre un popup indiquant " Message copié.".
J'aimerais que ce popup soit centré sur la page, ou ouvre une autre page avec le message inclus.
Mais je n'y connais rien de rien en JS.

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

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
 
 <!-- Le formulaire -->
    <form id="form-copier" >
        <!-- champ de saisie de texte -->
        <textarea id="texte"  cols="90" rows="5" disabled="disabled"><?php echo $_SESSION["Balises2"]?> </textarea>
		<br /><br />
        <!-- Bouton copier -->
        <button onclick="copierTexte(event)" >Copier le texte</button>
    </form>
    <!-- Le script JavaScript -->
	<script type="text/javascript">
    // On sélectionne le formulaire
    var form_copier_coller = document.getElementById("form-copier")
    // On sélectionne le <textarea>
    var textarea_texte = document.getElementById("texte")
 
    // Copier le texte
    copierTexte = (e) => {
        // On désactive l'action du formulaire
        e.preventDefault()
        // 1. Si le <textarea> n'est pas vide
        if (textarea_texte.value.length) {
            // 2. On copie le texte dans le presse-papier
            navigator.clipboard.writeText(textarea_texte.value).then(() => {
                // 4. On affiche l'alert
                alert("Texte copié !")// Centrer le message ou ouvrir une autre page.
                 })
</script>

Merci.

[wisefun77]

Bonjour,

Pour ouvrir une autre page j'ai trouvé.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
window.location = 'page.php';

Mais je crois que Alert est géré par la navigateur.

[Doksuri]

bonjour, alert() va "stopper" tout script tant que l'utilisateur n'a pas clique sur "ok"
de plus, il sera bientot supprime de chrome, je deconseil fortement son utilisation, au meme titre que confirm() & prompt()

pour ce qui est de ta popin, tu peux aller au plus simple et utiliser un dialog qui fera tres bien l'affaire

Code javasscript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
navigator.clipboard.writeText(textarea_texte.value).then(() => {
const dialog = document.createElement('dialog');
dialog.textContent = 'text copié';
document.body.append(dialog);
dialog.append(document.createElement('br'));
const btn = document.createElement('button');
btn.textContent = 'fermer';
dialog.append(btn);
btn.addEventListener('click', () => { dialog.close(); });
dialog.showModal();
})

tu pourras styliser ta dialog avec du css classique apres

[wisefun77]

Bonjour Doksuri,
Merci pour ton code.
De plus sur le serveur IIS , le bouton copier , ne fonctionne pas. il ne redirige pas vers la page, ni ouvre le popup du navigateur.
J'espère que ton code va aussi solutionner cette erreur qui vient de m'être remontée.
Je croise les doigts.

Le serveur ne sait pas lire ce code

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

<?PHP include '/Data/monfichier.php';?>

Il faut que je mette tous mes include ainsi

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

<?PHP include 'Data/monfichier.php';?>

UN grand et sincère merci à toi.

[wisefun77]

Bonjour Doksuri,

Ton code fonctionne très bien merci.
Je vais ouvrir un autre sujet, car sur le serveur IIS, il ne fonctionne pas.

Merci encore à toi.