ITFunda.Com
Your details are safeBuyer's Satisfaction
Contact Us
Welcome Guest | Register | Login Why online training? | Buyers FAQs | Testimonials | Contact us

Subscribe


Subscribe to Tutorials feed

Our Quality Professors


Our professors includes
Contact us for training ...

Training Timing availability

Timing in IST

Online training and Job Support slots are available in the morning & evening Indian Time Zone.

Contact us for any query.

Technology Tags


ADO.NET AdRotator ASP.NET ASP.NET-AJAX Authentication-and-Authorization---LoginView BulletedList Button Caching Calendar Chart CheckBoxList Cookies CSharp CSS Cusotm-Control Debugging-and-Tracing DetailsView DropDownList-and-ListBox DropDownList-and--ListBox Error-handling FileUpload Forms-Authentication GridView HiddenField HTML HyperLink Image ImageButton ImageMap Javascript jQuery jQuery-Ajax jQuery-Attributes jQuery-effects jQuery-Effects jQuery-Events jQuery-How-to-Solution jQuery-Manipulations jQuery-Selectors jQuery-Traversing Label-and-Literal LinkButton ListView Localization-and-Globalization Login LoginName LoginStatus LoginStatus-and-LoginName-and-other-controls LoginView MasterPage Menu Meta-tags Panel PlaceHolder RadioButtonList Repeater Security Session-Management TextBox Themes-and-Skins Url-Routing User-Control Validations visual-studio Webconfig Working-with-Files-and-Folders

Search Tutorials

Keyword
eg. asp.net

Announcements

More ...


 

How to limit the maximum number of characters allowed in the Multiline textbox?


by: Itfunda Product Type: Tips and Tricks (Books) Technologies: ASP.NET  jQuery 

In this post, we are going to learn how to limit the maximum number of characters allowed in the Multi-line textbox (textarea) through client side (jQuery) as well as through server side (asp.net).

Through Server side code

ASPX Page

<asp:Label ID="lblMessage" runat="server" ForeColor="Red" EnableViewState="false" />
    <p>
        <asp:TextBox ID="txtDetails" runat="server" TextMode="MultiLine" Columns="50" Rows="5" /></p>
    <asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClick="SubmitData" />

Code behind
    protected void SubmitData(object sender, EventArgs e)
    {
        // allow only 500 characters
        var maxLength = 50;
        if (txtDetails.Text.Trim().Length > maxLength)
        {
            lblMessage.Text = string.Format("Sorry, only {0} characters are allowed.",
            maxLength);
            return;
        }
        // go ahead and write code to save the data
    }
In the above code snippet, we have a Label, a Multiline TextBox and a Button. On click of the button, we have fired SubmitData server side method. In this event we have checked the length of the content entered into the TextBox against the maxLength variable value (that we are assuming is the maximum characters should be allowed for this TextBox, in our case it is 50) and if the content length is more than 50, we are showing a message that only 50 characters are allowed in the TextBox and terminating the execution of the code for this method by writing the return statement otherwise the execution will not fall into the if block and remaining code execute.

Through Client side - using jQuery


ASPX Page

<script type="text/javascript" language="Javascript" src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.4.1.min.js"></script>
    Max characters allowed is 10 :
    <asp:TextBox ID="TextBox1" runat="server" TextMode="MultiLine" Columns="50" Rows="5"
        ClientIDMode="Static" />
    <label id="lblCharLeft">
    </label>
    <script language="javascript" type="text/javascript">
        var maxLength = 10; // change here to change the max limit
        // write the character left message
        $(document).ready(function () {
            $("#lblCharLeft").text(maxLength + " characters left");
        });
    
        // limit the characters
        $("#TextBox1").keyup(function () {
            var text = $(this).val();
            var textLength = text.length;
            if (textLength > maxLength) {
                $(this).val(text.substring(0, (maxLength)));
                alert("Sorry, you only " + maxLength + " characters are allowed");
            }
            else {
                $("#lblCharLeft").text((maxLength - textLength) + " characters left.");
            }
        });
    </script>
In the above code, first we have referred the jQuery file so that we shall be able to use the jQuery methods to achieve this functionality.

Apart from the Multiline textbox,we have an html label where we are showing how many more characters user is allowed to enter.

As soon as the page loads, we have displayed the maximum characters allowed for the TextBox in the lblCharLeft label. In our case we have hard coded the maximum characters allowed into the maxLength JavaScript variable. Using jQuery we have attached keyup event on the TextBox that fires whenever the user press any key and leave it. In this event, we have first stored the value of the TextBox in the text variable and then stored its length into the textLength variable. The next line compares the text length and max length allowed and if it exceeds then set first max characters allowed (in my case 10) into the TextBox and shows an alert message. If entered text is not more than the max allowed length, it writes a message of how many more characters are left into the html label


This post is the part of following product

.NET Tips and Tricks

.NET Tips and Tricks This ".NET How to Tips and Tricks" contains solutions of hundreds of technical problems that help you to develop real time .NET projects easily. It has following features
  • Video tutorials
  • Demo projects source code
  • eBook with to-the point explanations & output
prepared by Sheo Narayan (Microsoft MVP).

 Latest tutorials

 Posts from Itfunda

  • ASP.NET Training - Complete Web Development Training
    ASP.NET 4.0 using Visual C# - A comprehensive web development online training. This training gives you real time scenario based knowledge on HTML, JavaScript, CSS, C#, ASP.NET and ASP.NET AJAX that help you to work on any kind of web development projects in .NET technologies. This training is delivered by Sheo Narayan (Ex Microsoft MVP). Suitable for Windows developer or a complete freshers in the IT Industry.
    List Price: $400.00 Discount: 25.00% | Final Price: Rs 15000.00/$300.00
    More details ...

  • Online .NET Freshers Training with Projects
    This course is completely for freshers where he/she will be learning the .NET technology right from the basics.
    List Price: $325.00 Special Discount: 11.00% | Final Price: Rs 13594.75/$289.25
    More details ...


Share this to:




About Us | Contact Us | Partners | Privacy Policy | Terms and Conditions | Buyer's FAQs | Seller's FAQs | Currency Converter | Go Top

Notice: If you found someone plagiarising our content/materials, kinldy let us know.

© SN ITFunda Services LLP. Site design and layout is copyright to SN ITFunda Services LLP.
Copying or duplicating or mimicking the site design and layout is prohibited and will be treated as a legal offence and will be prosecuted.
Logos, company, product, service or other names used here if any are only for reference purposes and they may be respective owner's right or trademarks.