Is there a way to show a word count in or around the message box?

[Chris]

Hello,

I'm using an internal API that has rate and size limiting and I think it would be beneficial to show the user a used character out of total characters placeholder. Something similar to this as an example.

[Stoyan]

Hello Christopher,

Although, a character counter isn't supported out-of-the-box by the Chat here is how you can subscribe to its TypingStart Event and add a custom element that contains a character counter:

1. Subscribe to the TypingStart Event

   .Events(e => e.TypingStart("onTypingStart"))

2. Insert the new element and subscribe to the input event of the Chat's input element.
3. In the input handler update the counter and optionally hide it when the user deletes their message.

       function onTypingStart(e){
           var wrapperElement = e.sender.element.parent();
           var input = wrapperElement.find("input");
           if($("#char-count").length<1){
               $("<div id='counter' style='margin-top:10px;'><span id='char-count'>0</span>/<span>4000</span></div>").insertAfter(wrapperElement[0]);
               input.on("input",countCharacters);
               input.trigger("input");
           }
       }
       function countCharacters(e){
           var inputString = $(e.currentTarget).val();
           if(inputString.length>0){
               if($("#counter").css("display")!="none"){
                   $("#char-count").text(inputString.length);
               }else{
                   $("#counter").show();
               }
           }else{
               $("#counter").hide();
           }
       }

For your convenience I have applied the above to this Telerik REPL example: https://netcorerepl.telerik.com/cHarPNvo16ZYReB335

Regards,
Stoyan
Progress Telerik