Issue Regarding inner html while using dialog dropdown

Hi @kirthika,

Ensure your dropdown/select field uses correct Coral 3 syntax.

Example for a valid granite:FormSelect:

<granite:FormSelect
    jcr:primaryType="nt:unstructured"
    name="./example"
    fieldLabel="Example Dropdown"
    required="{Boolean}false">
    <items jcr:primaryType="nt:unstructured">
        <option1
            jcr:primaryType="nt:unstructured"
            text="Option 1"
            value="option1" />
        <option2
            jcr:primaryType="nt:unstructured"
            text="Option 2"
            value="option2" />
    </items>
</granite:FormSelect>

Avoid mixing coral- prefixed elements directly unless you're certain about timing and rendering lifecycle.

Step 2: Validate Dialog Load Timing

If you're using dropdowns inside a multifield or dynamically injected content, wrap dropdown rendering in:

$(document).on("dialog-ready", function() {
  // safe to access dropdown DOM elements here
});

Step 3: Check for Custom Clientlib Conflicts

If you're using custom clientlibs to modify dialog behavior:

• Check for timing issues (e.g., DOM not available yet).

• Make sure you're not prematurely querying .innerText or similar properties.

• Use console.log or breakpoints to identify null selectors in your JS.

Step 4: Test in Vanilla Core Component

To isolate the issue:

1. Try using a core component dialog (e.g., core/wcm/components/text/v2/text).

2. Add a select field there. If it works, your issue is specific to dialog structure or custom JS in your component.

Try this temporarily: Use this in browser console when dialog is open:

document.querySelectorAll('coral-select').forEach(select => {
  console.log(select, select.innerText);
});

If any of the selects return null or throw error, that’s the one causing issues.

Hope that helps!

@kirthika Did you find the suggestions helpful? If you need more information, please let us know. If a response resolved your issue, kindly mark it as correct to help others in the future. Alternatively, if you discovered a solution on your own, we'd appreciate it if you could share it with the community. Thank you !