4

Is there any way to select all text within a multiline asp:textbox and copy it to client clipboard by clicking a button, using c#?

Thank you in advance.

jaleel
  • 373
  • 8
  • 13

4 Answers4

2

You can use document.execCommand("copy"); just be aware that this is supported by new browsers mostly and as far as I know there is no support for Safari:

 <head runat="server">
    <title></title>
    <script src="https://code.jquery.com/jquery-1.12.2.min.js"></script>
    <script type="text/javascript">
        $(function () {
            $("#btnCopy").click(function () {
                var id = "#" + "<%= txtText.ClientID %>";
                try {
                    $(id).select();
                    document.execCommand("copy");
                }
                catch (e) {
                    alert('Copy operation failed');
                }
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <asp:TextBox ID="txtText" runat="server" Text="Some sample text to copy"></asp:TextBox>
        <button id="btnCopy">Copy</button>
    </form>
</body>

Tested and works with the following browsers:

  1. IE 11 and up
  2. Google Chrome 51.0.2704.84
  3. Firefox 43.0.1
Denys Wessels
  • 16,829
  • 14
  • 80
  • 120
1

I think @Denis Wessels answer was great but used plain textarea instead of asp:TextBox, therefore I want to write my own that includes asp:TextBox control.

Consider you have a multi-line text area with asp:TextBox server control and a button to copy content into clipboard:

<asp:TextBox ID="TextArea" runat="server" TextMode="MultiLine">
<button id="copy">Copy to Clipboard</button>

Use jQuery and a JS function similar to this:

<script type="text/javascript">
$(document).ready(function () {
        $("#copy").click(function() {
            // use ASP .NET ClientID if you don't sure
            // for ASP .NET 4.0 and above, set your ClientID with static mode
            var textarea = "<%= TextArea.ClientID %>"; 
            $(textarea).select();
            $(textarea).focus(); // set focus to this element first
            copyToClipboard(document.getElementById(textarea));
        });
});

function copyToClipboard(elem)
{
    var result;
    var target = elem;
    startPoint = elem.selectionStart;
    endPoint = elem.selectionEnd;

    var currentFocus = document.activeElement;
    target.setSelectionRange(0, target.value.length);

    try
    {
        // this may won't work on Safari
        result = document.execCommand("copy");
    }
    catch (e)
    {
        return alert("Copy to clipboard failed: " + e);
    }

    // returning original focus
    if (currentFocus && typeof currentFocus.focus === "function") {
        currentFocus.focus();
    }

    elem.setSelectionRange(startPoint, endPoint);

    return result;
}
</script>

Reference with minor changes: https://stackoverflow.com/a/22581382, https://stackoverflow.com/a/30905277

Note that for ASP .NET 4 and above you can set static ClientID:

<asp:TextBox ID="TextArea" runat="server" TextMode="MultiLine" ClientID="TextArea" ClientIDMode="Static">

thus you can use $("#TextArea") directly rather than $("<%= TextArea.ClientID %>").

Community
  • 1
  • 1
Tetsuya Yamamoto
  • 24,297
  • 8
  • 39
  • 61
0

You can use this class: System.Windows.Forms.Clipboard.SetText(..) <= Sets the text to clipboard, Inside SetText(), you put textbox.Text to get the text from the multiline asp.net textbox.

Anders Gill
  • 305
  • 1
  • 6
0

function copyToClipboard(element) {
  var $temp = $("<input>");
  $("body").append($temp);
  $temp.val($(element).text()).select();
  document.execCommand("copy");
  $temp.remove();
}
<link href='https://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<center>
  <p id="p1">Hello, I'm TEXT 1</p>
  <p id="p2">Hi, I'm the 2nd TEXT</p><br/>

  <button onclick="copyToClipboard('#p1')">Copy TEXT 1</button>
  <button onclick="copyToClipboard('#p2')">Copy TEXT 2</button>

  <br/><br/><input type="text" id="" placeholder="TEST it here;)" />
</center>
Kunal Goswami
  • 1
  • 1