Jump to content

Copy a text and open a link


Matija
 Share

Recommended Posts

hi,

I have a HTML document with a table with more rows

Example:

Column A: text123

Column B: button

 

When pressing a button in column B, I would like a text in column A to be copied to a clipboard + a certain page to be opened in a new tab (for example: www.google.com).

 

any suggestions would be appreciated,

Matija

Link to comment
Share on other sites

As you said i have written some code here it is.

function copy() {
  var copyText = document.getElementById("myInput");
  copyText.select();
  document.execCommand("copy");
  alert("Copied the text: " + copyText.value);
}

<form action="https://www.w3docs.com/" method="get" target="_blank">
<input type="text" value="Hello World" id="myInput">
<button onclick="copy()">Copy text</button>
</form>

I hope it'll be helpful to you.

 

 

Link to comment
Share on other sites

My HTML is like this:

<!DOCTYPE html>
<html>
<body>
<form action="https://www.w3docs.com/" method="get" target="_blank">
    <table>
        <tr style='background-color:darkgray;color:black;'>
        <th>Column A</th>
        <th>Column B</th>
        </tr>
        <tr>
        <td id="myInput" >1234</td>
        <td><button onclick="copy()">Copy</button></td>",
        </tr>
        <tr>
        <td id="myInput" >5678</td>
        <td><button onclick="copy()">C</button></td>",
        </tr>
    </table>
</form>
<script>
function copy() {
  var copyText = document.getElementById("myInput");
  copyText.select();
  document.execCommand("copy");
  alert("Copied the text: " + copyText.value);
}
</script>
</body>
</html>

 

It still doesn't copy the number "1234" in column A when clicking the button Copy in column B. what did I do wrong?

When clicking the button in the second row I want a number  "5678" to be copied. The web page opens.

 

Thank you for your help.

Matija

Link to comment
Share on other sites

Cool it is working as I want it!

Can you please help me with one more thing? What if I have multiple rows?

like this:

    <table>
        <tr style='background-color:darkgray;color:black;'>
        <th>Column A</th>
        <th>Column B</th>
        </tr>
        <tr>
        <tr id="somerow">
        <td id="myInput" >1234</td>
        <td><button onclick="myFunction()">Copy</button></td>
        </tr>
        <tr id="somerow">
        <td id="myInput" >5678</td>
        <td><button onclick="myFunction()">Copy</button></td>
        </tr>
    </table>

 

With this code it always copies the text in the first row. what do i need to change that the second button copies text 5678?

Your help is very much appreciated (I'm new to HTML).

Thank you.

Link to comment
Share on other sites

Id should be unique within a page, that is why it selects only the first.

I would use a check box for each row, then check the checkbox you want to gather data for those rows, loop through each, checking if selected then store values in array or append directly into div container or even another table.

Link to comment
Share on other sites

Sure for £1000 pound a minute, or you could learn it yourself, be much cheaper that way.

Bit free advise to get you going

1: remove multiple duplicate id reference as it will never work.

2: add extra column, doesn't matter where, and each row of that column add checkbox with name attribute. See half the works done already once that's done.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...