Question 85858 in ASP.NET Question posted in
The official documentation can be found here.

ASP.Net C# WebForms Copying to ClipBoard does not work from code behind

I have a content page with a master page in ASP.NET
I have a button that would run a sql code and generate a string. I am then setting the text of a label to that string so that I can later pass it to a JavaScript to copy the string to Clipboard.

Clicking button 1 generates the string:

 <asp:Button ID="Button2" runat="server" OnClick="Button2_Click" Text="Generate List chain" class="btn btn-default"/>
      <script>

and in code behinf

   protected void Button2_Click(object sender, EventArgs e)
    {
        //SQL code would normally generate the text to store in Label1.Text;
        Label1.Text = "Testing";

       }

I can then trigger the following javascript by clicking a button to copy the string to Clipboard

 <script>
          function copyToClipboard() {
              var text = document.getElementById('<%= Label1.ClientID %>').innerText;
              
              if (window.clipboardData && window.clipboardData.setData) {
                 return window.clipboardData.setData("Text", text);

              }
              else if (document.queryCommandSupported && document.queryCommandSupported("copy")) {
                  var textarea = document.createElement("textarea");
                  textarea.textContent = text;
                  textarea.style.position = "fixed";  
                  document.body.appendChild(textarea);
                  textarea.select();
                  try {
                      return document.execCommand("copy");  
                  }
                  catch (ex) {
                      console.warn("Copy to clipboard failed.", ex);
                      return prompt("Copy to clipboard: Ctrl+C, Enter", text);
                  }
                  finally {
                      document.body.removeChild(textarea);
                  }
              }
          }

      </script>


   <asp:Button id="Button3"
   Text="Copy to ClipBoard"
   OnClientClick="copyToClipboard();return false;"
       class="btn btn-default"
   runat="server"/>

This is working perfectly fine. However it requires clicking button 2 then button 3.
I have tried to simplify this by triggering the javascript code from the code behind:

        protected void Button4_Click(object sender, EventArgs e)
    {
        Label1.Text = "Testing";
        ScriptManager.RegisterStartupScript(this.Page, this.GetType(), "copyToClipboard", "copyToClipboard();", true);

    }

However, no matter what I do and while the individual components work, combining them as in the last code snippet wouldnt work. I suspect this is related to the fact that ScriptManager is in the MasterPage and the code I listed above is in the Child/Content page (?).
Any advise about how to solve this is much appreciated.
AM

Tags:

3

Answers


  1. 0

    In ASP.NET, you can copy text to the clipboard by using JavaScript.

    Here is an example of how to implement it:

    1. Add a button to your ASP.NET page:

    <asp:Button ID="btnCopy" runat="server" Text="Copy to Clipboard" OnClientClick="copyToClipboard();" />

    2. Write a JavaScript function to copy the text to the clipboard:

    function copyToClipboard() {
    var copyText = document.getElementById("<%= txtCopy.ClientID %>");
    copyText.select();
    document.execCommand("copy");
    alert("Copied to clipboard: " + copyText.value);
}

    This function selects the text in an ASP.NET text box with the ID "txtCopy", executes the "copy" command to copy the text to the clipboard, and displays an alert message to indicate that the text has been copied.

    3. In the code-behind file of your ASP.NET page, set the value of the text box to the text that you want to copy:

    protected void Page_Load(object sender, EventArgs e)
{
    txtCopy.Text = "Text to be copied";
}

    This sets the value of the text box with the ID "txtCopy" to the text that you want to copy to the clipboard.

    That’s it! When the user clicks the "Copy to Clipboard" button, the text will be copied to the clipboard and an alert message will be displayed. Note that the "copy" command may not work in all browsers, so you may need to provide an alternative method for copying the text.

    Login or Signup to reply.
  2. 0

    Click event:

    onclick="copyOnClipboard('textname')"

    JS Code:

    function copyOnClipboard(elementID) {
        var copyText = document.getElementById(elementID);
        copyText.select();
        copyText.setSelectionRange(0, 99999);
        document.execCommand("copy");
    }
    Login or Signup to reply.
  3. 0

    Unfortunately, this is not allowed.

    The browser detects and wants a real click event – one that occurred client side.

    Browser will detect if a REAL click event has not occurred, and thus does not allow the clipboard copy function.

    Without this security then its possible for someone to visit any old site, and that site could inject to your clipboard without ANY user interaction whatever they wanted.

    You unfortunately thus have to provide perhaps a nice popup dialog – say a nice jQuery.UI one.

    Or, simple fill out a text box, and beside have a nice cool looking "copy link" button.

    Your code is ok. And as you noted it tested and worked with a simple button on the client side.

    However, that clipboard function needs a "real" user click event, and one that originated from the client side browser for this to work.

    it is a browser security measure, and thus injecting some JavaScript code into the browser with RegisterStartupScript can’t be used.

    As noted, you could inject a nice looking popup dialog (say a jQuery.UI one), and offer a button + link. So, this has to be a client side click event that triggers the running of that code. As noted, not even a jQuery.click(), or JavaScript .click() method of a button inserted by RegisterStartupScript to trigger that code can be used here. Nor as you have now, a simple call to that js routine.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search