AEM 6420 - Touch UI Sites validate page name


In AEM Sites, validate name entered for page during creation (here the validator registered checks for lowercase letters, numbers and underscore)

For similar validation of asset file names check this post

Demo | Package Install | Github


1) Login to CRXDE Lite, create folder (nt:folder) /apps/eaem-touchui-sites-page-validation

2) Create clientlib (type cq:ClientLibraryFolder) /apps/eaem-touchui-sites-page-validation/clientlib and set property categories of String[] type to cq.sites.validations and dependencies String[] to lodash

3) Create file ( type nt:file ) /apps/eaem-touchui-sites-page-validation/clientlib/js.txt, add the following


4) Create file (type nt:file) /apps/eaem-touchui-sites-page-validation/clientlib/page-name-validate.js, add the following code

(function ($, $window) {
    "use strict";

    var PATTERN = /^[a-z0-9_]+$/,
        ERROR_MSG = "Acceptable characters in page name are lowercase alphabets, numbers, underscore <b>" + PATTERN + "</b>";

    $window.adaptTo("foundation-registry").register("foundation.validation.validator", {
        selector: '[data-foundation-validation~="admin.pagename"]',
        validate: function(el) {
            if (!PATTERN.test(el.value)) {
                return ERROR_MSG;
}(jQuery, jQuery(window)));

1 comment:

  1. i want to make modification in the touch-ui-validate-asset-file-names-on-upload js code for -if the file name to be uploaded(AEM File upload) contains more than 60 characters,truncate it to 60 characters and also if the file name contains special characters,then replace all the special characters with a single -(hyphen) sign.