Text field content limits



I have a form with a few fields where my users will enter content.  It is my intent to limit the amount to text entered, but rather than add a character limit, I would like add some word count counter feature with the field.  Something like (150 of 300 words used) so the user knows they are approaching the word limit.  I would prefer a word limit over a character limit as I want to provide guidance rather than forced limitation.



Accepted Solutions (1)

Accepted Solutions (1)




Hi @jmackesy 


You will have to use Granite validator to apply this check. I have  created a sample code for the same functionality. 


Follow these steps:

1. Create clientlibs with category "cq.authoring.dialog"

2. Add this js



(function ($) {
    'use strict';

    $(window).adaptTo("foundation-registry").register("foundation.validation.validator", {
	    selector: ".custom-word-limit",
	    validate: function(element) {
	        var elementValue = element.value;
            var wordLimit = element.dataset.wordLimit;
	        if(elementValue && wordLimit && elementValue.split(' ').filter(function(n) { return n != '' }).length > wordLimit){
				return "Word limit for the field is " + wordLimit;




3. Add granite:class property with value "custom-word-limit" to the textfield where you want to apply this word limit check like this:
Screenshot from 2020-06-16 16-13-48.png

4. Then add a "granite:data" node under the textfield of type nt:unstructured and add property word-limit = 100. Change this number to any number of which you want to apply the limit for this particular field like this
Screenshot from 2020-06-16 16-16-08.png

5. The author will get message like this

Screenshot from 2020-06-16 16-18-32.png


Try this and let me know if it works for you.



Answers (1)

Answers (1)



You will probably have to use custom JavaScript to get the word count and display the appropriate message in the fields long description