3

I'm developing a grid and now I'm trying to copy information from the grid to Excel. Everything works as expected, but if the data is too big, the copy process takes a long time.

I'm using the textarea trick, with "document.execCommand("copy")".

I could see that my problem is here "textarea.select();" Pasting the text in the textarea is very fast, but it takes a looooong time to select all the text. After that is also quick to send to the clipboard. The problem seems to be the select.

I'm talking about copying arrays like [500000, 40]. A lot of data.

I've tried some Chrome API, but couldn't find any good solution by the end. Is there any other clever way to copy data to the clipboard?

3
  • highly doubt there is much you can do. Commented Oct 12, 2018 at 19:14
  • 1
    an input should render much faster than a textarea, try that if you can live w/o linebreaks Commented Oct 12, 2018 at 19:16
  • haha, I can't live without linebreaks, I need to paste in Excel Commented Oct 12, 2018 at 19:18

1 Answer 1

6

The problem is the time taken by data processing is longer than the execCommand("copy").

Actually copy requires to be called in user generated event and there is a time limit attached to it(there is no mention anywhere but with my work I found it to be ~5 secs, any specification on this will be welcomed). If your data processing needs more than this it will not copy the data. One solution to this is to get the data processed in advance and then open dialog/popup to ask the user to click button to copy the data.

Further for a fast copy (doesn't work in safari) you can use below method:

var contentToCopy;
function copyDataToClipboard(e) {
    e.preventDefault(); // default behaviour is to copy any selected text
    e.clipboardData.setData("text/plain", contentToCopy);
}
function copy(content) {
    contentToCopy = content;
    document.addEventListener("copy", copyDataToClipboard);
    try {
        document.execCommand("copy");
    } catch (exception) {
        console.error("Copy to clipboard failed");
    } finally {
        document.removeEventListener("copy", copyDataToClipboard);
    }
}

copy(content = [Any content you would like to copy to clipboard]);

Hope this will resolve your issues related to copying large data.

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

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.