Expand my Community achievements bar.

Dive into Adobe Summit 2024! Explore curated list of AEM sessions & labs, register, connect with experts, ask questions, engage, and share insights. Don't miss the excitement.

Radio button value persists but not retrieved in touch UI dialog

Avatar

Level 3

Hi All,

    When I drag and drop the component on to the page and authored the component and selected the radio button and submitted the aem touch ui dialog and compoennt properties asved successfully. But when I re-open the aem dialog again then I am not able to see that none of the radio buttons are selected. Can anyone please help me on this issue.

 

Thanks,

Pavan

5 Replies

Avatar

Community Advisor

@MandaPavanKumar : 

Can you check your radio field in you dialog follows below structure.

 

myradiogroup
    - sling:resourceType = "granite/ui/components/foundation/form/radiogroup"
    + items
      + option1
        - sling:resourceType = "granite/ui/components/foundation/form/radio"
        - name = "browser"
        - value = "ie"
        - text = "Internet Explorer"
      + option2
        - sling:resourceType = "granite/ui/components/foundation/form/radio"
        - name = "browser"
        - value = "chrome"
        - text = "Chrome"
      + option3
        - sling:resourceType = "granite/ui/components/foundation/form/radio"
        - name = "browser"
        - value = "firefox"
        - text = "Firefox"

 

Thanks,

Siva 

Thanks,
Siva

Hi Siva, 

     I am using following structure for the radigroupin aem dialog:

 

Please correct me I I am having issue.

Thanks,

<formServiceAreas
                                    granite:id="formServicesAreas"
                                    jcr:primaryType="nt:unstructured"
                                    sling:resourceType="granite/ui/components/coral/foundation/form/radiogroup"
                                    name="./formServicesAreas"
                                    required="{Boolean}false">
                                    <items jcr:primaryType="nt:unstructured">
                                        <convention-centers
                                            granite:id="convention-centers"
                                            jcr:primaryType="nt:unstructured"
                                            sling:resourceType="granite/ui/components/foundation/form/radio"
                                            class="hide title-url-hide-show"
                                            formTemplate="se_hub_reach_out"
                                            name="./convention-centers"
                                            renderReadOnly="{Boolean}true"
                                            text="Convention Centers"
                                            value="conventionCenters"/>
                                        <multiple-services
                                            granite:id="multiple-services"
                                            jcr:primaryType="nt:unstructured"
                                            sling:resourceType="granite/ui/components/foundation/form/radio"
                                            class="hide title-url-hide-show"
                                            formTemplate="bi_hub_reach_out"
                                            name="./multiple-services"
                                            renderReadOnly="{Boolean}true"
                                            text="Multiple Services"
                                            value="multipleServices"/>
                                        <food-services
                                            granite:id="food-services"
                                            jcr:primaryType="nt:unstructured"
                                            sling:resourceType="granite/ui/components/foundation/form/radio"
                                            class="hide title-url-hide-show"
                                            formTemplate="bi_hub_reach_out"
                                            name="./food-services"
                                            renderReadOnly="{Boolean}true"
                                            text="Food Services"
                                            value="foodServices"/>
                                        <refreshments
                                            granite:id="refreshments"
                                            jcr:primaryType="nt:unstructured"
                                            sling:resourceType="granite/ui/components/foundation/form/radio"
                                            class="hide title-url-hide-show"
                                            formTemplate="bi_hub_reach_out"
                                            name="./refreshments"
                                            renderReadOnly="{Boolean}true"
                                            text="Refreshments"
                                            value="refreshments"/>
											</items>
                                </formServiceAreas>

Pavan

Avatar

Community Advisor

Hi @MandaPavanKumar 

You are mixing Coral2 and Coral3 for radio button in your implementation.

 

Just try with either of them (Coral3 is recommended.)

https://github.com/arunpatidar02/aemaacs-aemlab/blob/f96ce5316dfa4798c72d2e87d3a0b41fc49791a4/ui.app... 



Arun Patidar

Avatar

Community Advisor

Hello @MandaPavanKumar ,
You can use Coral UI 3 Dialog field for the touch UI which is the latest one. The structure of the radio group will be like the one below. Here I attached the full dialog structure to avoid confusion.

<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
    jcr:primaryType="nt:unstructured"
    jcr:title="My Component"
    sling:resourceType="cq/gui/components/authoring/dialog">
    <content
        jcr:primaryType="nt:unstructured"
        sling:resourceType="granite/ui/components/coral/foundation/fixedcolumns">
        <items jcr:primaryType="nt:unstructured">
            <column
                jcr:primaryType="nt:unstructured"
                sling:resourceType="granite/ui/components/coral/foundation/container">
                <items jcr:primaryType="nt:unstructured">
                    <typeGroup
                            jcr:primaryType="nt:unstructured"
                            sling:resourceType="granite/ui/components/coral/foundation/form/radiogroup"
                            name="./typeGroup"
                            fieldLabel="Modal Open Type">
                        <items jcr:primaryType="nt:unstructured">
                            <optionOne
                                    jcr:primaryType="nt:unstructured"
                                    sling:resourceType="granite/ui/components/coral/foundation/form/radio"
                                    text="Option One"
                                    value="one"/>
                            <optionTwo
                                    jcr:primaryType="nt:unstructured"
                                    sling:resourceType="granite/ui/components/coral/foundation/form/radio"
                                    text="Option Two"
                                    value="two"/>
                            <optionThree
                                    jcr:primaryType="nt:unstructured"
                                    sling:resourceType="granite/ui/components/coral/foundation/form/radio"
                                    text="Option Three"
                                    value="three"/>
                        </items>
                    </typeGroup>
                </items>
            </column>
        </items>
    </content>
</jcr:root>