Validate Touch UI dialog field with a server side call | Community
Skip to main content
Level 2
May 15, 2019 9:18 AM UTC
Solved

Validate Touch UI dialog field with a server side call

I have a touch ui dialog for my AEM component .In this dialog there is a special field (textfield) and I want to validate the value entered by calling a web service.

I use the below JavaScript to register a validator

(function($, window, document) {

       var registry = $(window).adaptTo("foundation-registry");

       registry.register("foundation.validation.validator", {

             selector : "[data-validation=name-validate]",

             validate : function(el) {

                    var element = $(el);

                    var elementVal = element.val();

                    $.get("webserviceURL", function(data) {

                          if (data.error) {

                                 return "Invalid name";

                          } else {

                                 return;

                          }

                    });

             }

       });

})($, window, document);

I can see that the server side call is happening but the validation is not happening in the dialog.

This is because the service call is asynchronous and the validate function get an empty return immediately.

So my question is how to do such server side validations?

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
arunpatidar
arunpatidarAccepted solution
New Participant
May 15, 2019 1:21 PM UTC

try validation with jquery like below thread and make sync call

Adding multifields based on numberfield in AEM 6.4

e.g.

jQuery.ajax({
  url
: 'http://example.com/catalog/create/' + targetNode.id + '?name=' + encode(to.inp[0].value),
  success
: function (result) {
  
if (result.isOk == false) alert(result.message);
  
},
  
async: false
  
});

Arun Patidar

5 replies

Level 2
May 16, 2019 10:01 AM UTC

Thank you very much.

Translate
New Participant
Apr 2, 2020 10:14 AM UTC

Hi @dennyj13354090, How do you fixed the issue ?

Translate
arunpatidar
arunpatidarAccepted solution
New Participant
May 15, 2019 1:21 PM UTC

try validation with jquery like below thread and make sync call

Adding multifields based on numberfield in AEM 6.4

e.g.

jQuery.ajax({
  url
: 'http://example.com/catalog/create/' + targetNode.id + '?name=' + encode(to.inp[0].value),
  success
: function (result) {
  
if (result.isOk == false) alert(result.message);
  
},
  
async: false
  
});

Translate
Arun Patidar
Level 2
May 15, 2019 1:06 PM UTC

On dialog submit

Translate
arunpatidar
New Participant
May 15, 2019 10:20 AM UTC

Hi,

When are you calling web service? On load? on dialog submit or on input field blur event.

Translate
Arun Patidar