DOM values of existing Multifield Items changing after adding New | Community
Skip to main content
T
troubleshooter3
New Participant
October 3, 2023
Solved

DOM values of existing Multifield Items changing after adding New

  • October 3, 2023
  • 2 replies
  • 791 views

I have a custom tab in page properties where I have a multifield, the multifield consist of a coral-textfield which I convert to a coral-autocomplete through jquery on page load like below example :

 

 

 

 

Coral.commons.ready(autocomplete, function () { autocomplete = new Coral.Autocomplete().set({ placeholder: "place holder", name: "/xyz", match: "startswith", required: true, delay: 600 });

 

 

This works quite well the first time despite I add one or 10 items and also saves my autocomplete data at ./xyz in JCR, my issue starts when I load the saved page property and try to add more items to existing multifield, the moment I click add, the name attribute of existing coral-autocomplete in existing multifield-item changes to something like ./xyz./xyz and value becomes empty, and existing fields despite having data shows required, in this whole scenario the newly added item remains correct, similary if I start with 2 and later add 3rd first 2 will get wrong name and value and soon as I click add button of multifield to add 3rd item.

 

I am on 6.5 and use coral UI3

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 ManviSharma

Hi,

 

When initializing the Coral Autocomplete component, refrain from setting the name attribute to a generic value like "/xyz." Instead, employ a more unique and robust naming convention. Consider appending a unique identifier or counter to the name attribute, such as "/xyz_1," "/xyz_2," and so forth. This adjustment will help prevent conflicts with AEM's multifield naming conventions.

Coral.commons.ready(function () {
// Utilize a unique name attribute, e.g., /xyz_1, /xyz_2, etc.
var uniqueName = "/xyz_" + uniqueIdentifier;

var autocomplete = new Coral.Autocomplete().set({
placeholder: "place holder",
name: uniqueName,
match: "startswith",
required: true,
delay: 600
});
});

 

  • Secondly, When loading the page properties dialog and populating the multifield with pre-existing data from the Java Content Repository (JCR), exercise care in setting the name attribute for each Coral Autocomplete field appropriately based on the data retrieved from the JCR.

 

2 replies

ManviSharma
ManviSharmaAccepted solution
Employee
October 10, 2023

Hi,

 

When initializing the Coral Autocomplete component, refrain from setting the name attribute to a generic value like "/xyz." Instead, employ a more unique and robust naming convention. Consider appending a unique identifier or counter to the name attribute, such as "/xyz_1," "/xyz_2," and so forth. This adjustment will help prevent conflicts with AEM's multifield naming conventions.

Coral.commons.ready(function () {
// Utilize a unique name attribute, e.g., /xyz_1, /xyz_2, etc.
var uniqueName = "/xyz_" + uniqueIdentifier;

var autocomplete = new Coral.Autocomplete().set({
placeholder: "place holder",
name: uniqueName,
match: "startswith",
required: true,
delay: 600
});
});

 

  • Secondly, When loading the page properties dialog and populating the multifield with pre-existing data from the Java Content Repository (JCR), exercise care in setting the name attribute for each Coral Autocomplete field appropriately based on the data retrieved from the JCR.

 

    kautuk_sahni
    kautuk_sahni
    Employee
    October 10, 2023

    @mahi1729 @manvisharma  Can you please review this Question and share your thoughts? 

    Kautuk Sahni
    Terms & ConditionsAccessibility statement

    Loading footer...