Please navigate to the bottom of the page for Table of Contents

Saturday, July 16, 2011

jQuery to block paste in a textbox

In this min-post (and in the coming few posts), we will look at some quick ASP.NET and jQuery questions. These are real world, day-to-day problems that developers encounter and thus become very common interview questions.

Question: Consider an ASP.NET form which requires user to enter his name as confirmation (think Priceline’s site where you have to enter your initials as acceptance) in a textbox. We want to enforce the user typing into this textbox and not paste from somewhere else. How can you accomplish this using jQuery.

The key to solving this question is understanding the fact that jQuery allows you to bind to the “paste” event. The code do accomplish this is shown below.

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="BlockPaste.aspx.cs" 
Inherits="jQueryInterviewQuestions.BlockPaste" %>


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Block Paste</title>
<!-- include jQuery -->
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
   1:  
   2:     <script type="text/javascript">
   3:         // hook to the document ready function
   4:         $(document).ready(function () {
   5:             
   6:             // bind the paste operation
   7:             $('#<%=tbAccept.ClientID%>').bind('paste',
   8:                 function (e) {
   9:                     // prevent the default operation
  10:                     e.preventDefault();
  11:                     // warn the user
  12:                     alert("Paste disabled in this textbox");
  13:                 });
  14:  
  15:             });
  16:     
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
Please enter your name:
<!-- the textbox you want to disable paste on -->
<asp:TextBox runat="server" ID="tbAccept">
</asp:TextBox>
</div>
</form>
</body>
</html>

In the document.ready() function, we bind to the textbox in question’s “paste” event and prevent the default (paste) action. Then we warn the user that this is not allowed.

We can capture the cut and copy events in a similar fashion.

8 comments:

  1. I was very encouraged to find this site. I wanted to thank you for this special read. I definitely savored every little bit of it and I have bookmarked you to check out new stuff you post.

    write my essay

    ReplyDelete
  2. I am a real loser at crafting, but in my opinion about freelance, I'd assist with no doubts. Maybe, it can benefit you in your hobby, because ultius review can assist you to get how you can manage your effort. I believe it's gonna work anyway with any work.

    ReplyDelete
  3. Quite interesting, appreciate the photo! I am certain that you'll benefit from the hairstyles photo- should you go here. It really is inspiring! Really, the resource among the mine beloved. Information and lifehacks you searching for around wedding you can study here http://blurpalicious.com/p/unique-wedding-games-to-delight-your-guests/. It's very convenient - the main one resource solved all of your problems. I really like it!

    ReplyDelete
  4. I believe that you ought to ask anticipates. It is by all accounts a significant troublesome undertaking identified with subtleties. Regardless of whether I know the appropriate response, folks from HOW MILLENNIALS BALANCE THEIR CAREER AND TRAVEL could clarify it better. I gave this site for instance, yet there could be another alternative. For instance, some exceptional composition assets. I would truly prescribe you to have a proceed to inquire. Each undertaking that was connected with composing I have finished with the help of those folks. They truly know their work

    ReplyDelete
  5. online Quran classes on Islam has given, and ensure the youngster numerous rights, and these ?rights are ?ensured by Islam to all kids, ?for example, the privilege to instruction, and charged guardians and moms and different guardians to train youngsters all that they need after adolescence learn Quran particularly Quran internet perusing? Go along with us now and welcome your loved ones both youthful and old and you will discover all that you need to learn here. https://patendo.com/cara-membuat-merek/

    ReplyDelete
  6. Your blogs are easily accessible and quite enlightening so keep doing the amazing work guys.
    best website designers

    ReplyDelete