I have written this yaml to display checkboxlist

project_toolbox: label: Toolbox type: checkboxlist options: adobe-suite: 'Adobe Suite' html: HTML css: CSS solidworks: Solidworks affinity-photo: 'Affinity Photo' affinity-design: 'Affinity Design' affinity-publisher: 'Affinity Publisher' keyshot: Keyshot power-tools: 'Power Tool' stationary-tool: 'Stationary Tool' fdmprinter: '3D Printer' CNC-Router: 'CNC Router' CNC-Laser: 'CNC Laser'

And wrote to display the checkboxlist but it does not work, can anyone assist me to get this working?

{% for toolbox_item in project_toolbox %} <div class="{{ option.name }}"><span>{{ toolbox_item }} </span></div> {% endfor %}

Hi

Example:
https://www.youtube.com/watch?v=4zXuiCiBNE8

field yaml

project_toolbox:
    label: Toolbox 
    type: checkboxlist 
    options: 
        adobe-suite: 'Adobe Suite' 
        html: HTML 
        css: CSS 
        solidworks: Solidworks 
        affinity-photo: 'Affinity Photo' 
        affinity-design: 'Affinity Design' 
        affinity-publisher: 'Affinity Publisher' 
        keyshot: Keyshot 
        power-tools: 'Power Tool' 
        stationary-tool: 'Stationary Tool' 
        fdmprinter: '3D Printer' 
        CNC-Router: 'CNC Router' 
        CNC-Laser: 'CNC Laser'

post page

        {% set project_toolbox = post.getField('project_toolbox') %}

        {% set options = { 
                'adobe-suite': 'Adobe Suite',
                'html': 'HTML',
                'css': 'CSS',
                'solidworks': 'Solidworks',
                'affinity-photo': 'Affinity Photo', 
                'affinity-design': 'Affinity Design', 
                'affinity-publisher': 'Affinity Publisher', 
                'keyshot': 'Keyshot', 
                'power-tools': 'Power Tool', 
                'stationary-tool': 'Stationary Tool', 
                'fdmprinter': '3D Printer', 
                'CNC-Router': 'CNC Router', 
                'CNC-Laser': 'CNC Laser' } %}

        <div class="container py-5">
            {% component 'blogPost' %}

            <h4>Example #1</h4>
            <p>Mark selected</p>

            {% for key, value in options %} 

                <div>
                    <input type="checkbox" id="{{key}}" name="options" {% if key in project_toolbox %}checked{% endif %} onclick="return false"/>
                    <label for="{{key}}">{{value}}</label>
                </div>

             {% endfor %} 

             <h4>Example #2</h4>
             <p>Only selected</p>

            {% for item in project_toolbox %} 

                <div>
                    <input type="checkbox" id="{{item}}" name="options" checked onclick="return false"/>
                    <label for="{{item}}">{{options[item]}}</label>
                </div>

             {% endfor %} 

        </div>

Last updated 8 months ago

Thank you for solution and uploaded YouTube video. Much appreciate