Create a button to copy a table and paste into Excel

The JavaScript to do this task is well known. It is simply a case of finding how to deliver it into the web page. Options include

• a view
• a form
• a (Gutenberg) content block

In this first implementation I am using a form.

1. In your view have the tag <table id="tableId">
2. Create a new form
3. Add a hidden field to it (this will not be used)
4. Settings > General >
   1. On Submit > Redirect to URL = ./
   2. Do not store entries
   3. Check Ajax options
5. Settings > Form Actions
   1. Delete all
6. Customise HTML
   1. delete form classes
   2. delete before fields
   3. After fields =

script type="text/javascript">
//from https://stackoverflow.com/questions/2044616/select-a-complete-table-with-javascript-to-be-copied-to-clipboard
function selectElementContents(el) {
var body = document.body, range, sel;
if (document.createRange && window.getSelection) {
range = document.createRange();
sel = window.getSelection();
sel.removeAllRanges();
try {
range.selectNodeContents(el);
sel.addRange(range);
} catch (e) {
range.selectNode(el);
sel.addRange(range);
}
document.execCommand("copy");

} else if (body.createTextRange) {
range = body.createTextRange();
range.moveToElementText(el);
range.select();
range.execCommand("Copy");
}
alert("Table copied to clipboard. You can now paste it into Excel or another application");
}
</script>

4. Submit Button

<div class="frm_submit">
<input type="button" value="Copy table" onclick="selectElementContents( document.getElementById('tableId') );">
</div>