How to iterate thru a webform checkbox results

Question

How do you iterate thru a webform checkbox array like so :

Checkboxes_name :
☒ option 1
☒ option 2

[webform_submission:values:checkboxes_name_:value] print :

option 1, option 2

I would like to have

- option 1
- option 2

I tried something like this and other variants, but no luck :

<ul{{ webform_token('[webform_submission:values:checkboxes_name_', webform_submission)}}>
  {% for item in webform_submission.values.checkboxes_name_ %}
    <li>{{ item.value }}</li>
  {% endfor %}
</ul>

Thanks for your help

Answer 1

I'm not sure this require a technical answer. We would need more informations about the template you're in.

Usually, when you experience this kind of difficulty to access or decorate data, it means you're at the wrong template level. Manually iterating on elements in a template is not the "Drupal Way".

The rendering engine will do it for you and provide a template name (suggestion, that you could see in the source code with the debug activated)

Check carefully the provided theme suggestions to choose the template in which the actual checkbox is rendered.

Override the template by using a more specific suggestion. Copy the code from the previously used template, you will have to the name and attributes of the checkbox element and it will be much easier to manage the display you want.

Answer 2

In my case i solved it like this:

1. Use the split function as cchen mentioned to be able to use a for loop over it
2. Inside the loop use twig string concat to add the current loop index: [webform_submission:values:checkboxes_name_:'~loop.index0 ~':value'

{% set checkboxes_names = webform_token('[webform_submission:values:checkboxes_name_:value]', webform_submission, [], options)|split(', ') %}

<ul>
{% for item in checkboxes_names %}
<li>
{{webform_token('[webform_submission:values:checkboxes_name_:'~loop.index0 ~':value', webform_submission, [], options)}} 
</li>
{% endfor %}
</ul>