Expand my Community achievements bar.

Don’t miss the AEM Skill Exchange in SF on Nov 14—hear from industry leaders, learn best practices, and enhance your AEM strategy with practical tips.
SOLVED

how to retrieve the previously authored data if I have changed the component dialog box for component in AEM as a cloud service

Avatar

Level 5

->I have a component where earlier there were three fields stored under the name : ./name , ./address , ./phonenum

->  I have changed the component dialog box and made those fields multifield

->but I want my previously authored data to be stored as the first entry of the multifield

-> for e.g : Now I have three items in my multifield  and I want the previously authored data to be populated in my first item in             multifield

-> this component is used in multiple pages I don't want to reauthor everything  , that's why I want the first multifield to be populated with the previously authored data (before enhancement).

 

Thank you

 

1 Accepted Solution

Avatar

Correct answer by
Level 5

Doing this via groovy Script now ,

I am fetching the properties and creating nodes and storing values within it .

 

View solution in original post

5 Replies

Avatar

Level 5

you can make your text fields hidden and when the dialog will be loaded you can read their previously authored data; if any value is authored,  programmatically click the multifield add button in new multi fields and populate it.

 

here is what we did for a similar scenario:

 

(function ($, Coral) {
"use strict";
$(document).on("dialog-ready", () => {

Coral.commons.ready(this, () => {
const existingtextfield = $(".coral-Form-field[name='./existingtextfield']").val();
const newMultiField = $("coral-multifield[data-granite-coral-multifield-name='./newMultiFields']");
const newMultiFieldLength = $(newMultiField).find("coral-multifield-item").length;

if (!newMultiFieldLength &&existingtextfield) {

$(newMultiField).find("button[coral-multifield-add]").click();
async function populateMultifieldItem() {
await new Promise(resolve => setTimeout(resolve, 500));
$(newMultiField).find(".coral-Form-field[name='./newMultiFields/item0/./path']").val(existingtextfield);
}
populateMultifieldItem();
}

//hiding all fields with below custom class authored
$(".hide-dialog-field").each(function () {
$(this).closest(".coral-Form-fieldwrapper").hide();
});
});

});

$(document).on("click", ".cq-dialog-submit", function (e) {
$(".coral-Form-field[name='./existingtextfield']").val("");
});

})(jQuery, Coral);

 

Avatar

Level 5

but using this we need to open the content dialog box to run the changes

 

in the requirement, I will not open the dialog box to change anything

Avatar

Level 5

you'll have to add support from backend as well for both old and new property.

if new is not there then put a check if old one is there and show the content based on that 

Avatar

Community Advisor

Hi @rahul234dabas 

 

We had a similar scenario when we migrated from Coral UI 2 to Coral UI 3, where in we had to convert data that was stored in JSON format to nodes.

 

Write a Servlet that queries and fetches all your existing multifield nodes, stores the existing data in some Data structure and create nodes for Multifield. 

 

Below code would help you to convert it from JSON to Nodes. You might have to alter logic to first fetch your existing singular node data and then convert it to multifield nodes.

 

https://github.com/arunpatidar02/aem63app-repo/blob/master/java/MultifieldConvertCoral2to3Servlet.ja...

 

Thanks,

K**bleep**ij

Avatar

Correct answer by
Level 5

Doing this via groovy Script now ,

I am fetching the properties and creating nodes and storing values within it .