dziks
dziks

Reputation: 45

TypeError: text.select is not a function

I am trying to implement copy to clipboard feature using js.
I have a table:

<tbody>
            <tr>
                <td>1.</td>
                <td id="kord">(35|154)</td>
                <td id="gorj">15</td>
                <td>3,6</td>
                <td><button type="button" onclick="copyKord()">Kopiraj</button></td>
                <td><button type="button" onclick="copyGorj()">Kopiraj</button></td>
                <td><input type="number"></td>
            </tr>
</tbody>

My js function:

    function copyKord(){
    var text = document.getElementById("kord").innerHTML;
    console.log(text);
    text.select();
    document.execCommand("copy");
}

So when i press the button i get an error "TypeError: text.select is not a function at copyKord" when i console.log the variable it shows the text. I tried using textarea insted of a td element and it still didn't work.

Upvotes: 2

Views: 2179

Answers (1)

Derek Wang
Derek Wang

Reputation: 10204

You can use navigator.clipboard.writeText to perform copy action.

function copyKord(){
    var text = document.getElementById("kord").innerHTML;
    navigator.clipboard.writeText(text);
}

function copyGorj() {
  var text = document.getElementById("gorj").innerHTML;
    navigator.clipboard.writeText(text);
}
<table>
  <tbody>
            <tr>
                <td>1.</td>
                <td id="kord">(35|154)</td>
                <td id="gorj">15</td>
                <td>3,6</td>
                <td><button type="button" onclick="copyKord()">Kopiraj</button></td>
                <td><button type="button" onclick="copyGorj()">Kopiraj</button></td>
                <td><input type="number"></td>
            </tr>
  </tbody>
</table>

Upvotes: 2

Related Questions