.NET Mixer: Javascript to check multiline textbox max length asp.net C# VB.Net

Most of the asp.net developers knew that maxlength property of textbox will work even the multiline property set to true. But it doesnot work. To check or restrict maxlength of a multiline textbox you have to develop a javascript fucntion. In this article i will show you how you can limit or restrict multine textbox character limit using javascript.

If you are looking for textarea then click here.

Output Like:
maxlength check textbox multiline

The javascript function is given below:

<script type="text/javascript">
        function ismaxlength(objTxtCtrl,nLength)
        {
            if (objTxtCtrl.getAttribute && objTxtCtrl.value.length>nLength)
                objTxtCtrl.value=objTxtCtrl.value.substring(0,nLength)
            
            if(document.all)
                document.getElementById('lblCaption').innerText=objTxtCtrl.value.length +' Out Of '+nLength;
            else
                document.getElementById('lblCaption').textContent=objTxtCtrl.value.length +' Out Of '+nLength;
            
        }
    
</script>

Call javascript from multiline TextBox:

<textbox columns="50" id="txtMultiline" onkeyup="return ismaxlength(this,255)" rows="5" runat="server" textmode="MultiLine"></textbox>    
        
<label id="lblCaption" style="font-family: Tahoma; font-size: 1em; font-weight: bold;"></label>

Complete HTML markup of my example page:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Multiline_limit.aspx.cs" Inherits="Multiline_limit" %>

<!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>How to check mutiline textbox max length using javascript</title>
    <script type="text/javascript">
        function ismaxlength(objTxtCtrl,nLength)
        {
            if (objTxtCtrl.getAttribute && objTxtCtrl.value.length>nLength)
                objTxtCtrl.value=objTxtCtrl.value.substring(0,nLength)
            
            if(document.all)
                document.getElementById('lblCaption').innerText=objTxtCtrl.value.length +' Out Of '+nLength;
            else
                document.getElementById('lblCaption').textContent=objTxtCtrl.value.length +' Out Of '+nLength;
            
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:TextBox ID="txtMultiline" runat="server" Rows="5" Columns="50" TextMode="MultiLine" onkeyup="return ismaxlength(this,255)" ></asp:TextBox>    
        <br />
        <label id='lblCaption' style="font-family:Tahoma;font-size:1em;font-weight:bold"></label>
    </div>
    </form>
</body>
</html>

Script tested for:
1. Internet Explorer
2. Mozilla Firefox
3. Opera
4. Google Chrome

.NET Mixer

Friday, February 5, 2010

Javascript to check multiline textbox max length asp.net C# VB.Net

2 comments: