Skip to main content
Naveen_AEM_dev
Naveen_AEM_dev
Level 4
Feb 15, 2016 5:56 AM UTC
Solved

Can I load an external js file in the listener node of a dialog

In some scenarios the dialogs of complex components have multiple listener nodes listening on various events. At times, the JS code in the listeners gets pretty complex and since this code is embedded in the listener node, it is very difficult to debug and troubleshoot issues.

Is there any way of writing the JS code for the listener in an external JS file and then including this file in the event changed property of listener node?

    This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
    kautuk_sahni
    kautuk_sahniAccepted solution
    Level 9
    Feb 15, 2016 9:35 AM UTC

    Hi 

    Please have a look at this post,

    Link:- http://stackoverflow.com/questions/26192217/how-to-make-textfield-required-using-listeners

    Dialog:

    <type jcr:primaryType="cq:Widget" fieldLabel="Type" name="./type" type="radio" xtype="selection"> <options jcr:primaryType="cq:WidgetCollection"> <email jcr:primaryType="nt:unstructured" text="Email" value="email"/> <url jcr:primaryType="nt:unstructured" text="Url" value="url"/> </options> <listeners jcr:primaryType="nt:unstructured" selectionchanged="function(field,value) { MyDialog.setRequired(field,value); }"/> </type>

    Listener JavaScript:

    MyDialog.setRequired = function(field,value) { var dialog = field.findParentByType("dialog"), email = dialog.getField('./email1'); if('url' == value) { email.allowBlank = true; }else{ email.allowBlank = false; } };
     

    I hope this will help you.

    Thanks and regards

    Kautuk Sahni

    Kautuk Sahni
    View in thread

    3 replies

    Jitendra_S_Toma
    Jitendra_S_Toma
    Level 10
    Feb 15, 2016 7:15 AM UTC

    Yes, All you need to do is create a clientlib with these javascript functions and include them in the header (Just make sure, functions are available before lister invoke them).

    Let me know if you face any issue.

    ---Jitendra

    Translate
      Mani_kumar_
      Community Advisor
      Mani_kumar_Community Advisor
      Community Advisor
      Feb 15, 2016 7:27 AM UTC

      Hi 

      As Jitendra said create a clietlib folder and listener as below

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

      External JS:

      var  javascriptObject= javascriptObject|| {};

      javascriptObject.beforeSubmit = function (dialog) {
          Write here your functionality
        
      };

       

      Translate
        kautuk_sahni
        kautuk_sahniAccepted solution
        Level 9
        Feb 15, 2016 9:35 AM UTC

        Hi 

        Please have a look at this post,

        Link:- http://stackoverflow.com/questions/26192217/how-to-make-textfield-required-using-listeners

        Dialog:

        <type jcr:primaryType="cq:Widget" fieldLabel="Type" name="./type" type="radio" xtype="selection"> <options jcr:primaryType="cq:WidgetCollection"> <email jcr:primaryType="nt:unstructured" text="Email" value="email"/> <url jcr:primaryType="nt:unstructured" text="Url" value="url"/> </options> <listeners jcr:primaryType="nt:unstructured" selectionchanged="function(field,value) { MyDialog.setRequired(field,value); }"/> </type>

        Listener JavaScript:

        MyDialog.setRequired = function(field,value) { var dialog = field.findParentByType("dialog"), email = dialog.getField('./email1'); if('url' == value) { email.allowBlank = true; }else{ email.allowBlank = false; } };
         

        I hope this will help you.

        Thanks and regards

        Kautuk Sahni

        Translate
        Kautuk Sahni
          Terms & ConditionsAccessibility statement

          Loading footer...