how to add listeners to multi-field text-field for touchui | Community
Skip to main content
M
mayurij73490671
Level 2
December 21, 2017
Solved

how to add listeners to multi-field text-field for touchui

  • December 21, 2017
  • 6 replies
  • 5157 views

help would be appreciate !!

this below approach is not working for multifield texfield listeners .

cq:dialog.xml for multifield

<vanityurl

                                    cq:showOnCreate="{Boolean}false"

                                    jcr:primaryType="nt:unstructured"

                                    jcr:title="Vanity URL"

                                    sling:resourceType="granite/ui/components/foundation/form/fieldset">

                                    <items jcr:primaryType="nt:unstructured">

                                        <vanitypath

                                            jcr:primaryType="nt:unstructured"

                                            sling:resourceType="granite/ui/components/foundation/form/multifield"

                                            cq-msm-lockable="sling:vanityPath"

                                            fieldLabel="Vanity URL"

                                            renderReadOnly="{Boolean}true">

                                            <field

                                                jcr:primaryType="nt:unstructured"

                                                sling:resourceType="granite/ui/components/coral/foundation/form/textfield"

                                                name="./sling:vanityPath"

                                              class="vanityPathClass"

                                                required="{Boolean}true"/>

                                        </vanitypath>

                                     

                                    </items>

                                </vanityurl>

listener.js

(function (document, $, ns) {

  "use strict"; 

  $(document).on("keyup", ".vanityPathClass", function (e) {

      var path = $(this).closest("form.foundation-form").attr("action").replace("/_jcr_content","");

      var vanityTitle=$(this).val();

console.log('----- bar -----');

console.log('----- path -----'+path);

console.log('----- vanity -----'+vanityTitle);

  });

    This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
    Best answer by aanchal-sikka

    Please refer to the following blog:

    https://experience-aem.blogspot.com/2017/12/aem-63-sample-coral-3-multifield-item-listener.html

    6 replies

    smacdonald2008
    smacdonald2008
    Level 10
    December 21, 2017

    Talked to our AEM TOuch UI Experts on thisl Response was:

    for the listener to register you can add it on “add” of mutlfield, so something like…

    var $multifield = $("#my_mult_field");
     
         $multifield.find(".js-coral-Multifield-add").click(function(){
         var textfield = //find the textfield in multifield
         });
    smacdonald2008
    smacdonald2008
    Level 10
    December 21, 2017

    We will also put out a HELPX article on this use case too in early 2018.

      M
      mayurij73490671Author
      Level 2
      December 22, 2017

      thanks

      but i need events on multifield keyup to check entered string (vanity-url ) is unique to the project ..

      smacdonald2008
      smacdonald2008
      Level 10
      December 22, 2017

      Check #11 here -- 2018 Community Articles (Updated Dec 21)

      R
      riteshm19780411
      Level 2
      December 2, 2019

      I am also having the same issue. I am trying to add minimum, maximum limit configuration extension to Coral 3 Multifield - 6.4 but it is not working.

      aanchal-sikka
      Community Advisor
      aanchal-sikkaCommunity AdvisorAccepted solution
      Community Advisor
      May 19, 2024

      Please refer to the following blog:

      https://experience-aem.blogspot.com/2017/12/aem-63-sample-coral-3-multifield-item-listener.html

      Aanchal Sikka
      Terms & ConditionsAccessibility statement

      Loading footer...