Expand my Community achievements bar.

SOLVED

Server Side Validation for a Widget

Avatar

Level 10

Hi,

Is there any example on how do we do a server side validation and send the message accordingly to a widget

1 Accepted Solution

Avatar

Correct answer by
Employee

Typically for fields you can add a validator attribute that calls a js function which can call a servlet. But.,if there is no validator function, you can do as below as well.

Add a listener as an unstructured node to the dialog like 

            
<listeners
 jcr:primaryType="nt:unstructured"
 beforesubmit="function(dialog){ return validateDialog(dialog); }"/>

In your js , make your ajax call.. This is just an example 

 

                                                                         
validateDialog = function(dialog) {
 var fields = dialog.findByType("numberfield"),
 expectedTotal = 100,
 width = 0;
  
 var width;
$.ajax("/bin/validatewidth",data:data,function(response){

width= response.width;
});
 
  
 if (width !== expectedTotal) {
 CQ.Ext.Msg.show({
 title:'Validation Error',
 msg:'Total width of all columns needs to be exactly 100 percent!',
 buttons: CQ.Ext.MessageBox.OK,
 icon:CQ.Ext.MessageBox.ERROR
 });
 return false;
 }
 return true;
 };

View solution in original post

3 Replies

Avatar

Level 10

Can you please explain your use case in more detail please. 

Avatar

Level 10

Hi Scott,

Here is what I would like to do

1. Textarea widget in a dialog. Authors enters some 'String'

2. Need to send this 'String' to OSGi layer, do some business logic validation and send back the message to the Dialog.

3. Display that message on the dialog for Authors.

Avatar

Correct answer by
Employee

Typically for fields you can add a validator attribute that calls a js function which can call a servlet. But.,if there is no validator function, you can do as below as well.

Add a listener as an unstructured node to the dialog like 

            
<listeners
 jcr:primaryType="nt:unstructured"
 beforesubmit="function(dialog){ return validateDialog(dialog); }"/>

In your js , make your ajax call.. This is just an example 

 

                                                                         
validateDialog = function(dialog) {
 var fields = dialog.findByType("numberfield"),
 expectedTotal = 100,
 width = 0;
  
 var width;
$.ajax("/bin/validatewidth",data:data,function(response){

width= response.width;
});
 
  
 if (width !== expectedTotal) {
 CQ.Ext.Msg.show({
 title:'Validation Error',
 msg:'Total width of all columns needs to be exactly 100 percent!',
 buttons: CQ.Ext.MessageBox.OK,
 icon:CQ.Ext.MessageBox.ERROR
 });
 return false;
 }
 return true;
 };