Modify dialog value after dialog submission in AEM

[Anderson_Hamer]

We want to get the input from page dialog(multifield) and add some prefix string(hardcode) before store the value in node. like /hardcodevalue/{dialogvalue} and store the value in node. Can we use any listeners to do this or what is the approach that should follow? please share any reference.

[Nikhil-Kumar]

@Anderson_Hamer 

You can use the Coral UI to get the Multifield data in Jquery and calling a servlet from the same Jquery where you can use the node api to save the modified data on the same multifield resource.

The listener that will help you will be $(document).on(“click”, “.cq-dialog-submit”, function(e) 

Please refer CoralUI in AEM
to get the multifield data in Jquery using CoralUI


Hope this procedure helps!!

Thanks,
Nikhil

[Anderson_Hamer]

Can this be done without a servlet ? there is no complex in backend. just want to prefix some hard coded value /hardcodevalue/{dialogvalue}

[arunpatidar]

If you will save the values on different place that means at /hardcodevalue/{dialogvalue} then you may face problem while retrieving values when dialog will be opened for editing again.

What is your use case?

[Anderson_Hamer]

No, I am not string the value in different location. same place with hard coded prefix value.

[Anudeep_Garnepudi]

Hi @Anderson_Hamer 

I would suggest create a hidden field in the dialog(granite/ui/components/coral/foundation/form/hidden) and set the value before submitting the dialog.

AG

[Manjunath_K]

Hi @Anderson_Hamer 

You can achieve this with dialog listeners, please refer below code for the same.

Dialog field : 

<textInput
    jcr:primaryType="nt:unstructured"
    sling:resourceType="granite/ui/components/coral/foundation/form/textfield"
    fieldDescription="Configure Text"
    fieldLabel="Text"
    granite:class="concat-txt-input"
    name="./textInput"/>

Add listener js code with clientlib category mentioned below :

(function ($, $document) {
    "use strict";
    $(document).on("click", ".cq-dialog-submit", function (e) {
        var $concatTextInput = $('.concat-txt-input');
        var $inputVal = $concatTextInput.val();

        if($inputVal.val()){
            var prefix = '/hardcodevalue/';
            $concatTextInput.val(prefix+$inputVal); //before submit concatenate input value with prefix
        }
    });
})($, $(document));

<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
      jcr:primaryType="cq:ClientLibraryFolder"
      categories="cq.authoring.dialog"/>

Hope this helps!

[tweety]

Thanks @Manjunath_K the above code is working fine but the 

 $concatTextInput.val(prefix+$inputVal);

is updating the same/only one value to all the input fields under mutifield.