Single click Select All text in TextArea using jQuery and ASP.NET

Sometimes it's easy if you just click on the text area with large text and all get selected so if you want to copy or remove in few clicks.

Today we will accomplish same using jQuery and ASP.NET textbox with textmode set as multiline.

 

Screenshot:

In our code we have two text areas with demo text. 1st text area have select all on single click enabled and 2nd text area does not.

The way we are going to approach is:

  1. We will create two asp.net textboxes with their textmode as multiline, this will render textarea for us in HTML code
  2. Next we will add a class with name "selectAll" to all the textboxes and textareas that we want to enable this feature
  3. Add reference to jQuery library
  4. Add click event on all controls that have class as "selectAll"
  5. In this event handler we will call "select()" method of jQuery

Code:

 

<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>

<script type="text/javascript">

$(document).ready(function () {

$('.selectAll').click(function () {

$(this).select();

});

});

</script>

<form id="form1" runat="server">

<div>

<asp:TextBox ID="txtSelect" class="selectAll" runat="server" TextMode="MultiLine"

Columns="20" Rows="10" />

<asp:TextBox ID="txtSelect2" runat="server" TextMode="MultiLine"

Columns="20" Rows="10" />

 

</div>

</form>

Tags: ,

ASP.NET | jQuery