Simple Copy and Paste column

Knack Community
1

Hello! I’m searching for a creative way to quickly copy and paste a column or two of information on the screen without exporting into a csv, then copying and pasting.

Typically, I’m trying to copy emails or phone numbers off a knack table to either email or text our clients.

Does anyone have any creative ways to select a column and simply copy the data out of that column, similar to excel? (I’ve researched some of the apps that would turn knack tables into excel-like spreadsheets, but they are cost prohibitive!)

Thanks for your ideas!!

2

Hi @Lakerogers,
This can be achieved through some JavaScript.

First, insert a Rich Text view on your page with the following code to add a custom button:

<input id="copyEmails" class="kn-button is-button is-small" type="button" value="Copy emails" onclick="">

Next, paste the following code into your app’s JavaScript section, making sure to replace view_xx with your table view ID, and td.field_yy with the field ID of the column you want to copy to the clipboard.

$(document).on('knack-view-render.view_xx', function(event, view, records) {
  $('#copyEmails').click(function() { // listen for button click
    const td = $('#' + view.key + ' td.field_yy')
    copyTdTextToClipboard(td);
  });
});

function copyTdTextToClipboard(td) {
  let tdTextArray = []; // create an empty array to hold the titles
  td.each(function() { // loop through all td elements in the table
    var title = $(this).text().trim(); // get the title attribute value of the current td
    tdTextArray.push(title); // append the title to the array
  });
  const textJoin = tdTextArray.join('; '); // join the elements of the tdTextArray into a single string with a semicolon and space separator
  navigator.clipboard.writeText(textJoin).then(function() { // copy the textJoin value to the clipboard
    console.log('Text copied to clipboard!');
  }, function() {
    console.error('Failed to copy text to clipboard!');
  }); 
}

When this particular view is rendered, the button will begin listening for a click, and once clicked, will copy all the visible values of your chosen column to the clipboard.
In the below example, I have mapped the button to copy the Contact email column, which will copy all 4 values to the clipboard like so:
accounts@abcindustries.com; services@plasterco.com; hello@a1buildingservices.com; orders@glimmerhomes.com

image

2 Likes
3

Thank you Stephen!

This code worked perfectly - the only error I made was typing in the column number (7) instead of the actual field number when inputting the code.

THANK YOU SO MUCH! This will save me so many hours of work.

2 Likes
4

Spectacular! Thanks @StephenChapman for an awesome snippet.

1 Like
5

Only just seen this one @StephenChapman - awesome solution. :facepunch:
Looking forward to giving it a go. :rocket:

1 Like