Restrict the Text Entered
During one of my projects I came across a requirement wherein , I had to create a feedback form,
where the user had to provide feedback to the organization , but not more than 6000 in lenght.
At that time i found that even though i restrict the length of my multiline textbox it would still take more
than 6000 alphabets.
JavaScript to the Rescue
so I created a custom Javascript method fnKeepWordLenTrack() and used it in the onblur and onkeyup events of Textbox.
and CountText() function in onKeyPress event of Textbox to stop inputing by user when he corsses his maximum permitted limit,
in my case which was 6000.
I also gave the user a dynamic display of the number of letters left for
him to type or enter.
Limit Conqured!!
Rest is history .. since the code and demo project is uploaded for your convenience.
Code Snippet :Simply Past and Restric --Enjoy
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" 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>Feedback Page</title>
<script language="JavaScript" type="text/javascript">
function CountText(field, maxlimit) {
if (field.disabled == false) {
if (field.value.length < maxlimit) // if too long...trim it!
{
return true;
}
else
return false;
}
}
function fnKeepWordLenTrack(keyevnt, field, maxlimit)
{
var txtRemLen = document.getElementById("txtRemLen");
txtRemLen.value = maxlimit - field.value.length;
if (field.value.length > maxlimit)
field.value = field.value.substr(0, maxlimit);
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
Please Enter Your Feedback in no more than 6000 alphabets<br />
<asp:TextBox ID="txtFeedback" runat="server" autocomplete="off" Height="198px"
MaxLength="6000" onblur="return fnKeepWordLenTrack(event,this,6000);"
onkeypress="return CountText(this,6000);"
onkeyup="return fnKeepWordLenTrack(event,this,6000);" TextMode="MultiLine"
Width="65%" BackColor="#D7EBFF"></asp:TextBox>
</div>
<p>
<input id="txtRemLen" maxlength="4" name="remLen" readonly="readonly" size="4"
style="width: 41px; height: 22px;" type="text" /><asp:Label
ID="lblAlphabetsLeft" runat="server" Font-Size="10pt"
Text="alphabets left"></asp:Label>
</p>
</form>
</body>
</html>