How to Set maxlength (character counter) for textbox in asp.net using jquery.
We learn in this article, how to set max length of multiple
textbox in asp.net c# with Jquery even at cut and paste. We have a Textbox
which has TextMode as "MultiLine". And we want to restrict the number
of characters to 1000 (key in and data paste), and also the div character counter
should reduce based on the characters.
Source Code:-
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!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></title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="MaxLength.min.js"></script>
<script type="text/javascript">
$(function ()
{
//Normal
Configuration
$("[id*=TextBox1]").MaxLength({
MaxLength: 100 });
//Enable
(with) Character Counter
$("[id*=TextBox2]").MaxLength(
{
MaxLength:
1000,
CharacterCountControl: $('#counter')
});
//Disable
(without) Character Counter
$("[id*=TextBox3]").MaxLength(
{
MaxLength:
100,
DisplayCharacterCount: false
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<fieldset style="width:
350px">
<legend>Noraml
MaxLength of textbox and counter </legend>
<asp:TextBox ID="TextBox1" runat="server" TextMode="MultiLine" Width="300" Height="100"></asp:TextBox>
</fieldset>
<br />
<fieldset style="width:
350px">
<legend>MaxLength
with Enable Character Counter </legend>
<asp:TextBox ID="TextBox2" runat="server" TextMode="MultiLine" Width="300" Height="100"></asp:TextBox>
<div id="counter" style="float:right;"/>
</fieldset>
<br />
<br />
<fieldset style="width:
350px">
<legend>MaxLength
with Disable Character Counter </legend>
<asp:TextBox ID="TextBox3" runat="server" TextMode="MultiLine" Width="300" Height="100"></asp:TextBox>
</fieldset>
<br />
</form>
</body>
</html>
Note: Please download the file MaxLength.min javascript
How to Set maxlength (character counter) for textbox in asp.net using jquery.
Reviewed by NEERAJ SRIVASTAVA
on
8:39:00 PM
Rating:
No comments: