# Multiple choice HTML code

**URL:** <https://forums.realmacsoftware.com/t/multiple-choice-html-code/52266>\
**Category:** Elements API\
**Created:** [November 6, 2025, 1:51pm UTC](https://forums.realmacsoftware.com/t/multiple-choice-html-code/52266 "2025-11-06T13:51:50Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![MultiThemes](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/multithemes/32/25117_2.png) [@MultiThemes](https://forums.realmacsoftware.com/u/MultiThemes)\
**Post date:** [November 6, 2025, 1:51pm UTC](https://forums.realmacsoftware.com/t/multiple-choice-html-code/52266/1 "2025-11-06T13:51:50Z")

</div>

Hi everyone, I need help understanding how to handle multiple choices in HTML, where I can replace not just a single value like [segmented](https://docs.realmacsoftware.com/elements-docs/elements-language/component/properties.json/ui-controls/segmented) but parts of code.

Maybe I didn’t find the right page or examples 🤨

In the guide, I only found the [switch](https://docs.realmacsoftware.com/elements-docs/elements-language/component/properties.json/ui-controls/switch) @if(…) , which works well, but it only gives me two options.

![2025-11-06 at 14.48.00](https://europe1.discourse-cdn.com/flex005/uploads/realmacsoftware1/original/3X/d/4/d4f79efd6b2d06ddb57de176c3ba896169161012.jpeg)

This solution doesn’t work.

```auto
the JSON is fine.
{
                    "title": "options",
                    "id": "multiple",
                    "segmented": {
                        "default": {
                            "base": "aaa"
                        },
                        "items": [
                            {
                                "value": "aaa",
                                "title": "Option A"
                            },
                            {
                                "value": "bbb",
                                "title": "Option B"
                            },
                            {
                                "value": "ccc",
                                "title": "Option C"
                            }
                        ]
                    }
                }

HTML with this solution give me error

@if(multiple == 'aaa')
<div class="p-sm text-3xl text-center text-brand-100">
   option A
</div>
@endif

@if(multiple == 'bbb')
<div class="p-sm text-2xl text-left text-green-600">
   option B
</div>
@endif

@if(multiple == 'ccc')
<div class="p-sm text-xl text-right text-red-600">
   option C
</div>
@endif

```

I didn’t find anything else in the guide. Can someone point me in the right direction?  
Thanks!

---

<div class="post-metadata">

**Author:** ![ben](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/ben/32/28488_2.png) [@ben](https://forums.realmacsoftware.com/u/ben)\
**Post date:** [November 6, 2025, 2:43pm UTC](https://forums.realmacsoftware.com/t/multiple-choice-html-code/52266/2 "2025-11-06T14:43:40Z")

</div>

Elements templates don’t support inline conditional expressions like `@if(multiple == 'bbb')`.

Instead, handle your logic in **hooks.js** and pass the processed values back into the template.

Here’s an example:

```auto
const transformHook = (rw) => {
  const { multiple } = rw.props;

  rw.setProps({
    wantsA: multiple === 'aaa',
    wantsB: multiple === 'bbb',
    wantsC: multiple === 'ccc',
  });
};

exports.transformHook = transformHook;

```

Then, in your template, you can use those props directly:

```auto
@if(wantsA)
  A is wanted
@endif

@if(wantsB)
  B is wanted
@endif

@if(wantsC)
  C is wanted
@endif

```

For more details, check the [Hooks.js documentation](https://docs.realmacsoftware.com/elements-docs/elements-language/component/hooks.js/passing-data-to-templates). Let us know if you need more help 🙂

---

<div class="post-metadata">

**Author:** ![MultiThemes](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/multithemes/32/25117_2.png) [@MultiThemes](https://forums.realmacsoftware.com/u/MultiThemes)\
**Post date:** [November 6, 2025, 2:58pm UTC](https://forums.realmacsoftware.com/t/multiple-choice-html-code/52266/3 "2025-11-06T14:58:31Z")

</div>

Thanks @ben I’ll take a look!

---

<div class="post-metadata">

**Author:** ![MultiThemes](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/multithemes/32/25117_2.png) [@MultiThemes](https://forums.realmacsoftware.com/u/MultiThemes)\
**Post date:** [November 6, 2025, 3:53pm UTC](https://forums.realmacsoftware.com/t/multiple-choice-html-code/52266/4 "2025-11-06T15:53:19Z")

</div>

It works perfectly thanks, now I need to better understand how to handle more complex and nested scenarios like the standard components. I’m checking the guide 😀