2 choices of copying multidimentional array data to clipboard in javascript

Question

I would like to be able to have 2 buttons in my admin panel. One to copy my text as "pure text". And one button to copy my text while adding extra html tags( AND

). I do a lot of copy and paste for my work, and this would really help me work a bit faster.

Let's say you have this array:

let array = [{'head': 1, 'body': 'This is the body 1', 'content': 'This is the content 1'},{'head': 2, 'body': 'This is the body 2', 'content': 'This is the content 2'},{'head': 3, 'body': 'This is the body 3', 'content': 'This is the content 3'}]

In this array, I would like to copy /paste the content(from the above array) like this to a text file:

This is the body 1
This is the content 1
&nbsp;
This is the body 2
This is the content 2
&nbsp;
This is the body 3
This is the content 3

(The <br> cannot be visible on the text file...it needs to be a blank space that works in a .txt format, could this " " works?)

The second button should also copy the text from the array but surrounds the body and content with the below tags:

<h2>This is the body 1</h2>
<p>This is the content 1</p>
<br>
<h2>This is the body 2</h2>
<p>This is the content 2</p>
<br>
<h2>This is the body 3</h2>
<p>This is the content 3</p>

At the moment, I am here:

function copyToClipboard(){

    let array = [{'head': 1, 'body': 'This is the body 1', 'content': 'This is the content 1'},{'head': 2, 'body': 'This is the body 2', 'content': 'This is the content 2'},{'head': 3, 'body': 'This is the body 3', 'content': 'This is the content 3'}]
    
    //Copy(clipboard) Text only
            var text  = "";    
            //For Text only
            for (let i = 0; i < array.length; i++) {
              text += array[i]['body'] + "&nbsp;" + array[i]['content'] + "&nbsp;";
            }

    //Copy(clipboard) Text with html tags
    
        for (let i = 0; i < array.length; i++) {
          text += "<h2>" + array[i]['body'] + "</h2>" + "<p>" + array[i]['content'] + "</p>";
        }
    
    
        navigator.clipboard.writeText(text).then(() => {
        alert("Copied to clipboard");
        console.log("Copied to clipboard");
    })
}

I am not sure if I am going in the right direction.

Thanks for your help

What do you mean by "I would like to output the content first like this". Where do you want to output it? Do you mean console.log or do you mean writing it into .txt file? — Irakli Tchedia
– Irakli Tchedia, Commented Jul 15, 2022 at 20:22
Let me reword the thread a tiny bit to be more clear. One moment please. — Benny
– Benny, Commented Jul 15, 2022 at 23:18
I have made the question clearer, sorry about this. My English is not the best :-) — Benny
– Benny, Commented Jul 15, 2022 at 23:23

Irakli Tchedia · Accepted Answer · 2022-07-16 11:28:14Z

1

You will need to have 2 functions one for each button.

let array = [{'head': 1, 'body': 'This is the body 1', 'content': 'This is the content 1'},{'head': 2, 'body': 'This is the body 2', 'content': 'This is the content 2'},{'head': 3, 'body': 'This is the body 3', 'content': 'This is the content 3'}]

function copyAsText(){
    //Copy(clipboard) Text only
    var text  = "";    
    //For Text only
    for (let i = 0; i < array.length; i++) {
        text += array[i]['body'] + "\n" + array[i]['content'] + "\n";
    }

    navigator.clipboard.writeText(text).then(() => {
        console.log("Copied to clipboard");
    })
}


function copyAsHTML(){
    var text = "";
    //Copy(clipboard) Text with html tags
    for (let i = 0; i < array.length; i++) {
        text += "<h2>" + array[i]['body'] + "</h2>" + "<br>" + "<p>" + array[i]['content'] + "</p><br>";
    }
 
    navigator.clipboard.writeText(text).then(() => {
        console.log("Copied to clipboard");
    })
}

answered Jul 16, 2022 at 11:28

Irakli Tchedia

2791 silver badge8 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Benny Over a year ago

Thank you so much for this, I wonder if the clipboard method will work on both mobiles and desktops.

Collectives™ on Stack Overflow

2 choices of copying multidimentional array data to clipboard in javascript

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related