Introduction
Look at the images given blow that you frequently see on websites. In this article you are going to learn hoe to do this.
The screen when the character length exceeds the limit:
Follow the steps to create such a system.
Step 1:
Add the reference of the jQuery file in the head section of the web page, for example:
<script type="text/javascript" src="Scripts/jquery-1.4.1.min.js"></script>
Step 2:
Add the following jQuery method in the head section of the web page:
<script type="text/javascript" language="javascript">
$(document).ready(function () {
var txt = $("textarea[id$=txtComments]");
var txtMsg = $("label[id$=txtStatus]");
$(txt).keyup(function () {
var length = $(txt).val().length;
$(txtMsg).text("Total " + length + " Characters out of 200.");
$(txtMsg).css("background-color", length >= 201 ? "#FF0000" : "#FFFFFF");
});
});
</script>
Step 3:
Design the web page which contains TextBox, Label and a Button; for example:
<div>
Enter your comment
<br />
<asp:TextBox ID="txtComments" runat="server" TextMode="MultiLine" Height="164px" Width="298px"/>
<br />
<label id="txtStatus"></label>
<br />
<asp:Button ID="Button1" runat="server" Text="Submit" onclick="Button1_Click" />
</div>
Adora KrausePosted Feb 8, 2012, 11:19 PM
Hi Abhimanyu. You have presented your article very nicely. Everything is clearly understood.
Laura ParkerPosted Feb 8, 2012, 11:17 PM
Good job done,I will try this.
Abhi KumarPosted Feb 8, 2012, 11:11 PM
Nice article, Abhimanyu. Thanks for sharing.
Nitin SinghPosted Feb 8, 2012, 11:03 PM
Regards for this article, thanks