Prevent Cut, Copy and Paste Operations in an ASP.NET TextBox using jQuery

Posted by: Suprotim Agarwal , on 10/12/2009, in Category jQuery and ASP.NET
Views: 36069
Abstract: In this short article, I will demonstrate how to prevent users from doing Cut, Copy and Paste operations in an ASP.NET TextBox using jQuery.
Prevent Cut, Copy and Paste Operations in an ASP.NET TextBox using jQuery
 
In this short article, I will demonstrate how to prevent users from doing Cut, Copy and Paste operations in an ASP.NET TextBox using jQuery. This article is a sample chapter from my EBook called 51 Tips, Tricks and Recipes with jQuery and ASP.NET Controls. The chapter content has been modified to publish it as an article. Also please note that for demonstration purposes, I have included JavaScript into the same file. Ideally, these resources should be created in separate folders for maintainability.
The event handling approach in jQuery begins by attaching a handler to an event. The jQuery bind() event method does exactly the same and binds one or more events to a handler. The signature of the bind() method is as follows:
bind(eventType,data,handler)
The parameters of the bind() method are as follows:
eventType is a string holding a JavaScript event type such as click, focus, keyup etc.
data is some optional data you want to pass to the handler
handler is the event handler function which will execute when the event is triggered
Let us quickly jump to the solution and see how we can use the bind() event method to write minimal code to prevent cut, copy and paste operations on the textbox.
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>Prevent Cut, Copy and Paste Operations in a TextBox</title>
    <script type='text/javascript'
    src='http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js'>
    </script>
   
    <script type="text/javascript">
        $(function() {
        $('input[id$=tb1]').bind('cut copy paste', function(e) {
                e.preventDefault();
                alert('You cannot ' + e.type + ' text!');
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div class="bigDiv">
        <h2>Prevent Cut, Copy and Paste Operations in a TextBox</h2>
        <asp:TextBox ID="tb1" runat="server"
            Text="Text which cannot be copied/cut/pasted" 
            ToolTip="Try Copy/Cut/Paste in textbox"/>       
    </div>
    </form>
</body>
</html>
Observe how convenient it is to use jQuery to list multiple events (cut, copy, paste) together and bind it to a handler as shown below.  
$('input[id$=tb1]').bind('cut copy paste', function(e) {});
 
If the user performs any of these events on the textbox (tb1), the default behavior is prevented using e.preventDefault() and the user is alerted with a message. The e.type describes the type of event performed.
$('input[id$=tb1]').bind('cut copy paste', function(e) {
      e.preventDefault();
      alert('You cannot ' + e.type + ' text!');
});
 
CutCopyPaste
This piece of ‘minimal’ code handles a typical requirement where you are asked to ‘confirm’ an email address and want the user to type it manually, instead of copying and pasting it.
Note: Text can be edited in this textbox, but cut/copy/paste actions are prevented
This demo has been tested on IE7, IE8, Firefox 3, Chrome 2 and Safari 4.
There are plenty of such similar tips that I will be covering in my upcoming EBook over here 51 Tips, Tricks and Recipes with jQuery and ASP.NET Controls
I hope you liked this article and I thank you for viewing it.
If you liked the article,  Subscribe to the RSS Feed or Subscribe Via Email  
Give a +1 to this article if you think it was well written. Thanks!
Recommended Articles
Suprotim Agarwal, ASP.NET Architecture MVP, MCSD, MCAD, MCDBA, MCSE, is the CEO of A2Z Knowledge Visuals Pvt. He primarily works as an Architect Consultant and provides consultancy on how to design and develop .NET centric database solutions.

Suprotim is the founder and primary contributor to DotNetCurry, DNC .NET Magazine, SQLServerCurry and DevCurry. He has also written an EBook 51 Recipes using jQuery with ASP.NET Controls. and is authoring another one at The Absolutely Awesome jQuery CookBook.

Follow him on twitter @suprotimagarwal


Page copy protected against web site content infringement by Copyscape


User Feedback
Comment posted by brian on Wednesday, October 14, 2009 2:35 PM
couldn't someone just turn off javascript to defeat this check?
Comment posted by Paco on Wednesday, October 14, 2009 2:46 PM
Scripts like these are irritating a lot of people. I don't understand why developers write scripts like this.
Comment posted by SanjayU on Wednesday, October 14, 2009 5:05 PM
@Brian,
Yes, definitely...You could also install any one of the freely available HTTP traffic sniffers (Web Development Helper, HttpFox, HttpWatch, etc.) that will let you just grab the image/text/anything on the web page.

To all, don't use this and think what is on your page can't be ripped off, you're kidding yourself and wasting your time.
Comment posted by Suprotim Agarwal on Friday, October 16, 2009 5:55 AM
Thanks for your comments. JavaScript 'cannot' be used to replace server side validation. There should always be a check on the server-side to see if the data is valid. This script just demonstrates a simple way of preventing users from copying and pasting email addresses in boxes that say 'Confirm your email address'.

When the form is submitted, a server-side validation should be done. There are no two opinions about it. Since this is a sample chapter, I cannot add disclaimers to each one of them, although they have been mentioned in my book.
Comment posted by jaimin on Thursday, January 6, 2011 5:14 AM
thaks buddy....very nice post.....
Comment posted by sad on Sunday, February 19, 2012 12:29 AM
sadsadsadsadsad
Comment posted by hjhj on Thursday, April 19, 2012 2:33 AM
bind('cut copy paste') does 'cut copy paste' is a predefined function in jquery  Mr.Suprotim
Comment posted by hjhj on Thursday, April 19, 2012 2:34 AM
bind('cut copy paste') does 'cut copy paste' is a predefined function in jquery  Mr.Suprotim
Comment posted by Manish Ojha on Monday, September 16, 2013 3:20 AM
Just copy and paste the below javascript code to restrict copy ,paste and select of a webpage:

<script language="javascript" type="text/javascript">
          function disableselect(e) {            
              return false
          }
          function reEnable() {
              return true
          }
        
          document.onselectstart = new Function("return false")
        

          if (window.sidebar) {
              document.onmousedown = disableselect                    // for mozilla          
              document.onclick = reEnable
          }

          function clickIE() {
              if (document.all) {
                  (message);
                  return false;
              }
          }

        
          document.oncontextmenu = new Function("return false")

         var element = document.getElementById('tbl');

         element.onmousedown = function () { return false; }        // mozilla        

       </script>          

Comment posted by Manish Ojha on Monday, September 16, 2013 3:21 AM
If the above code will not work for Firefox then just add style="-moz-user-select:none" in the body tag
Comment posted by varadha on Wednesday, March 12, 2014 12:08 PM
your article works on asp.net sites only,  Here is a jQuery disabling event, this will help you  to disable on  on html  and php sites too.

http://kvcodes.com/2014/03/disabling-textbox-cut-copy-and-paste-operations/

Post your comment
Name:  
E-mail: (Will not be displayed)
Comment:
Insert Cancel