Enforce character limit before submit

3 posts, 1 answers
  1. AP
    AP avatar
    222 posts
    Member since:
    Apr 2010

    Posted 05 May 2011 Link to this post

    The MaxTextLength property checks the limit on submit, but I need a way of stopping any characters being entered once the limit has been reached, I'm prepared to take the performance hit.

    I can display an alert message once the limit is reached, but how can I stop any more text being entered?

    NB: The users can only see the text entry view, the HTML view is hidden, and the character limit is for the text entered, not the html length.

    The function I have so far is:-
    <script type="text/javascript">
        function OnClientLoad(editor) {
            editor.attachEventHandler("onkeydown", function (e) {
                var content = editor.get_text(); //returns the editor's content as plain text
                var words = 0;
                if (content) {
                    var punctRegX = /[!\.?;,:&_\-\-\{\}\[\]\(\)~#'"]/g;
                    var contentcontent = content.replace(punctRegX, "");
                    var trimRegX = /(^\s+)|(\s+$)/g;
                    contentcontent = content.replace(trimRegX, "");
                    if (content) {
                        splitRegX = /\s+/;
                        var array = content.split(splitRegX);
                        words = array.length;
                    }
                }
                var counter = $get("counter");
                  
                var limit =<%  Response.Write(charimit.ToString());%>
                counter.innerHTML = "Words: " + words + " Characters: " + content.length;
                if(content.length > limit)
                {
                    alert("Too many characters!");
                     
                }
      
            });
        }
      
    </script>

    Ideally, after the alert has popped up, the character that had just been entered would be deleted, or at least future entry would be prevented (although any deletions would have to be allowed).

    Thanks
  2. Answer
    Rumen
    Admin
    Rumen avatar
    13803 posts

    Posted 09 May 2011 Link to this post

    Hi AP,

    You can stop the key event using the $telerik.cancelRawEvent(e); method, e.g.

    if (content.length > limit - 1) {
        alert("Too many characters!");
        $telerik.cancelRawEvent(e);
    }

    Of course you should exclude the Delete and BackSpace keys from this check.

    You can cgeck the isAlphaNumericKey function available in the following article: http://www.telerik.com/help/aspnet/editor/includingsymbolcounterandlimitthetextlength.html

    Note that parts of the code applies to RadEditor Classic only.

    Regards,
    Rumen
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  3. AP
    AP avatar
    222 posts
    Member since:
    Apr 2010

    Posted 11 May 2011 Link to this post

    Thanks, that's great.

    I've the code is now:-
       function OnClientLoad(editor) {
           editor.attachEventHandler("onkeydown", function (e) {
               var content = editor.get_text(); //returns the editor's content as plain text
               var words = 0;
               if (content) {
                   var punctRegX = /[!\.?;,:&_\-\-\{\}\[\]\(\)~#'"]/g;
                   var contentcontent = content.replace(punctRegX, "");
                   var trimRegX = /(^\s+)|(\s+$)/g;
                   contentcontent = content.replace(trimRegX, "");
                   if (content) {
                       splitRegX = /\s+/;
                       var array = content.split(splitRegX);
                       words = array.length;
                   }
               }
               var counter = $get("counter");
                 
               var limit =<%  Response.Write(wordLimit.ToString());%>
               var threshold=<%  Response.Write(warningThreshold.ToString());%>
               counter.innerHTML = "Words: " + words + " Characters: " + content.length;
               if(content.length > limit)
               {
                     
                   if (isAlphaNumericKey(e.keyCode))
            {
               alert("Too many characters!");
               $telerik.cancelRawEvent(e);
            }
      
                     
                    
               }
               if(content.length > threshold)
               {
                   warning.innerHTML="WARNING: You are approaching the character limit for this section!";
               }
               else
               {
                   warning.innerHTML="";
               }
           });
       }
        function isAlphaNumericKey(keyCode)
    {
         if ((keyCode > 47 && keyCode < 58) || (keyCode > 64 && keyCode < 91))
         {
             return true;
         }
         return false;
    }
    And works fine.
Back to Top