OOTB Validation options for Content Fragment Model Data Type

Avatar

Avatar
Ignite 1
Level 2
NehaCMS
Level 2

Likes

19 likes

Total Posts

40 posts

Correct reply

2 solutions
Top badges earned
Ignite 1
Validate 1
Boost 5
Boost 3
Boost 10
View profile

Avatar
Ignite 1
Level 2
NehaCMS
Level 2

Likes

19 likes

Total Posts

40 posts

Correct reply

2 solutions
Top badges earned
Ignite 1
Validate 1
Boost 5
Boost 3
Boost 10
View profile
NehaCMS
Level 2

14-01-2021

Hi Team,

 

Looking into Validation section at https://experienceleague.adobe.com/docs/experience-manager-cloud-service/assets/content-fragments/co... 

Validation

Various data types now include the possibility to define validation requirements for when content is entered in the resulting fragment:

  • Single line text
    • Compare against a predefined regex.
  • Number
    • Check for specific values.

 

But while creating content fragment model and  using single line text property or number property could not see option to provide validation regex. We are using AEM 6.5.6.0. Let me know how same can be added on fields.

Accepted Solutions (1)

Accepted Solutions (1)

Avatar

Avatar
Establish
MVP
BrianKasingli
MVP

Likes

647 likes

Total Posts

608 posts

Correct reply

239 solutions
Top badges earned
Establish
Ignite 1
Give Back 5
Give Back 3
Give Back 10
View profile

Avatar
Establish
MVP
BrianKasingli
MVP

Likes

647 likes

Total Posts

608 posts

Correct reply

239 solutions
Top badges earned
Establish
Ignite 1
Give Back 5
Give Back 3
Give Back 10
View profile
BrianKasingli
MVP

14-01-2021

@NehaCMS,

Sure that the documentation says regex validation, but from experience, I don't think there's an out of the box way of adding validation to content fragment form fields with regex, however, you can create your own via JavaScript and client libraries!

In the past, I have created a client library that would inject HTML5 input pattern attribute in regex to each form field. Once the pattern field has been added into the input field, the disabled vs enabled submit button will automatically work as expected & also a red error box is shown (look at the screenshot in the bottom of the page). Before creating your own client library, you should go directly to the /dam/my-site/content-fragment's edit page (NOT THE content fragment template), and then paste this line of code in your developer's console. $('input[name=myinputfield]').attr("pattern", 'working|works').... make sure you change the name=myinputfield to your own input fields name. Once when you know how it works, you can proceed with the steps below.

  1. Create a new client library (categories should be:  dam.cfm.authoring.v2)
  2. Write your own JavaScript validation using HTML pattern

 

 

$('input[name=myinputfield]').first().attr('pattern', '[A-Z]+');
let $form = $('#aem-cfm-editor-elements-form');
let $saveBtn = $('.button-apply');
$('input').on('keyup', function() {
    if ($form[0].checkValidity()) {
        $saveBtn.removeClass('is-disabled');
    } else {
        $saveBtn.addClass('is-disabled');
    }
});

 

 

Invalid - expecting regex pattern or working|works (red box displays, save button disabled)

BrianKasingli_0-1610664718895.png

Valid - matches regex pattern or working|works (red box does not exist, save button enabled) 

BrianKasingli_1-1610664824727.png

Client library

BrianKasingli_0-1610665621520.png

 

 

I hope this works, 
Brian.

 

 

Answers (0)