In AEM how to add a new node called “listeners” in the component dialog ,without using dialog.xml file.

[dhanu010]

Actaully i am using  "before submit" listener to do some validation for my selection box

I have reffered the following link:

https://helpx.adobe.com/experience-manager/using/classic_dialog_validation.html .

But "before submit" method calling only when i place  ,

dialog listener in the dialog root level only.

how to place  dialog listener in dialog root level(I checked in my project there is no dialog.xml file ,they using only java code  to construct  component dialog).

Can anyone please help me in  this ?

Dialog construction code :

@DialogField(name = DialogConstants.FIELD_NAME_PREFIX + PROPERTY_GNF_PROGRAM, fieldLabel = "GNF Program",

      fieldDescription = "(synchronized)",

    additionalProperties = {

          @Property(renderIn = Property.RenderValue.TOUCH,

                name = DialogConstants.PROPERTY_VALIDATION,

                value = "mt-gnf-program")

                     },

    listeners = {

    @Listener(name ="beforesubmit",

                     value = "function(dialog){" +

                     "  return gnfProgramValidation.beforeSubmit(dialog);" +

                             "}")

   })

           @Selection(

                    type = DialogConstants.TYPE_SELECT,

                    optionsProvider = "function(path, record) {" + "  return CQ.HTTP.eval('/content/global.gnfprograms.json');" + "}",

                    dataSource = GnfProgramsDataSource.RESOURCE_TYPE)

           public final String gnfProgram;

Java script code :

window.onload = function() {

gnfProgramValidation.init();

};

var  gnfProgramValidation = gnfProgramValidation || (function($) {

    function initialize() {

    };

    function validate() {

    alert("inside validate method");

        var res = true;

        return res;

    };

    return {

        beforeSubmit: validate,      

        init: initialize

    }

})(jQuery);

[Ten_A]

Moved from Adobe Creative Cloud to Adobe Experience Manager.

[smacdonald2008]

"how to place  dialog listener in dialog root level"

You use CRXDE Lite to add nodes to the dialog JCR nodes.

[Ratna_Kumar]

Hi,

You can use CRXDE Lite to add the nodes under the dialog and you can view the listeners dialogsubmit javascript code in dialog.xml.

But yes adding the listener's in the dilaog is the best practice.

Thanks,

Ratna.

[dhanu010]

Thanks for you suggestion Scott ,    

Yes we can add nodes by using CRXDE Lite . But once I build my project , then content modified through CRX will be erased.

[dhanu010]

Thanks for you suggestion Ratna Kumar,    

Yes we can add nodes by using CRXDE Lite . But once I build my project , then content modified through CRX will be erased.

[viveksachdeva]

I believe you are using maven component plugin.. Component (CQ Component Plugin 4.1.0 API)  has reference of the properties that you can use with it. In case it doesnt work as expected, I believe creating an issue in github repo for that would be better as it is an external plugin..

[smacdonald2008]

You can always build a package too for that part of your project - contains only those nodes. When you override the project, by rebuilding via Maven, you can reinstall the package.

[dhanu010 · Accepted solution]

Thank you all for your support. Found the following way to solve the issue .

I added ValidateFields method from within the  2 listeners (FIELD_LISTENER_LOAD_CONTENT and FIELD_LISTENER_SELECTION_CHANGED)

function ValidateFields(dialog) {

dialog.on("beforesubmit", function(e) {

   if(<condtion failed>)

    CQ.Ext.Msg.alert(CQ.I18n.getMessage("Error"), CQ.I18n.getMessage("<error message>"));

    return false;

   } else {

    return true;

   }

}, this);

}