How can i create a “Select all” button for a table

Question

I am creating an table for an website. The website returns its values in an table. i need to copy all values from the table td's, and paste them in excel. is there a way to make a "select all" button, so that i only need to press ctrl+c? Instead of dragging my mouse all the way down the table.

Code of the table i used here:

 <!DOCTYPE html> <html> <head> <style> table, th, td { border: 1px solid black; border-collapse: collapse; } </style> </head> <body> <h2>Select all test</h2> <button type="button">Select all</button> <table style="width:80%"> <tr> <th>Name</th> <th>Lastname</th> <th>Age</th> </tr> <tr> <td>Henk</td> <td>Bakker</td> <td>46</td> </tr> <tr> <td>Fedde</td> <td>hooghouts</td> <td>67</td> </tr> </table> </body> </html>

Answer 1

JS:

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);
            }
        } else if (body.createTextRange) {
            range = body.createTextRange();
            range.moveToElementText(el);
            range.select();
        }
    }

HTML:

<table id="tableId" border="1">
    <thead>
        <tr><th>Heading 1</th><th>Heading 2</th></tr>
    </thead>
    <tbody>
        <tr><td>cell 1</td><td>cell 2</td></tr>
    </tbody>
</table>

<input type="button" value="select table" onclick="selectElementContents( document.getElementById('tableId') );">

It should work ;)

Link from: Select a complete table with Javascript

How can i create a “Select all” button for a table

Question

1 answers

solution1
0 ACCPTED 2019-02-26 12:36:26

How can i create a “Select all” button for a table

Question

1 answers

solution1 0 ACCPTED 2019-02-26 12:36:26

solution1
0 ACCPTED 2019-02-26 12:36:26