Expand my Community achievements bar.

Learn about Edge Delivery Services in upcoming GEM session
SOLVED

[AEM6.5] Dialog Validation : Compare two textfield and value should be same.

Avatar

Level 6

Hi All,
I need to restrict author to put different name in given text field the value that they are authoring, it should be same. example:
We have 2 tabs : Name and Category. having textfield in it.

tushaar_srivastava_0-1674648343359.png

tushaar_srivastava_1-1674648375623.png

Now Author Should enter same values, means the value of Category should be same as Name or vice-versa. otherwise dialog will not save and shows error: value should be same.

I am trying to use Validator framework. and since it is component level validation I have created clientlibs under component, and provided clientlib category to component dialog using extraClientlibs : [categoryname].

tushaar_srivastava_2-1674648827161.png

 


Can anyone suggest me how to handle the validation of two fields.
validation =name-validation for Name tab and 
validation =category-validation for Category tab

(function($, Coral) {
    "use strict";
    var registry = $(window).adaptTo("foundation-registry");
    registry.register("foundation.validation.validator", {
        selector: "[data-validation=name-validation]",
        validate: function(element) {
            //
        }
    });

   
})(jQuery, Coral);


or is there any other better way to do this task


Thanks.
@arunpatidar  @kautuk_sahni  @BrianKasingli  @krati_garg  @aanchal-sikka 

Topics

Topics help categorize Community content and increase your ability to discover relevant content.

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

@tushaar_srivastava  Try below code snippet and change names accordingly, I have used category and title as files names. Shouls be same as name property value in dialog field.

(function($, Coral) {
    "use strict";
    var registry = $(window).adaptTo("foundation-registry");
    registry.register("foundation.validation.validator", {
        selector: "[name='./category']",
        validate: function(element) {
            let title = $("[name='./title']").val();
            if(title !== element.value) {
				return "Value is not same as Title";
            }
			return;
        }
    });
})(jQuery, Coral);

  

View solution in original post

2 Replies

Avatar

Correct answer by
Community Advisor

@tushaar_srivastava  Try below code snippet and change names accordingly, I have used category and title as files names. Shouls be same as name property value in dialog field.

(function($, Coral) {
    "use strict";
    var registry = $(window).adaptTo("foundation-registry");
    registry.register("foundation.validation.validator", {
        selector: "[name='./category']",
        validate: function(element) {
            let title = $("[name='./title']").val();
            if(title !== element.value) {
				return "Value is not same as Title";
            }
			return;
        }
    });
})(jQuery, Coral);

  

Thank you @Anudeep_Garnepudi , this worked and I was making code more complex by registring two different validators. and trying to pass as Array.
This really helped.