Friday, February 5, 2010

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




Please visit my new Web Site WWW.Codedisplay.com



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

2 comments:

Anonymous said...

Thanks a lot for this cool script!! :)

maveric said...

thanks for the script its good...

Want to say something?
I WOULD BE DELIGHTED TO HEAR FROM YOU

Want To Search More?
Google Search on Internet
Subscribe RSS Subscribe RSS
Article Categories
  • Asp.net
  • Gridview
  • Javascript
  • AJAX
  • Sql server
  • XML
  • CSS
  • Free Web Site Templates
  • Free Desktop Wallpapers
  • TopOfBlogs
     
    Free ASP.NET articles,C#.NET,VB.NET tutorials and Examples,Ajax,SQL Server,Javascript,Jquery,XML,GridView Articles and code examples -- by Shawpnendu Bikash