1

I have tried to follow the instructions listed here for checkboxes on frontend forms but have not been successful in implementation.

First, here is my code:

<form method="post" action="" accept-charset="UTF-8" enctype="multipart/form-data">
<div class="form-group">
<h3>Push to GistServers for Gist {{ entry.id }}</h3>
<input type="hidden" name="action" value="gistClient/pushGistUnits">
<input type="hidden" name="entryId" value="{{ entry.id }}">
<p>Select Gist Categories for Distribution.</p>
{% if entry.gistCategories | length == 0 %}
    <ul>
        {% for option in entry.gistCategories.options %}
        <input type="checkbox" value="{{ option.value }}" name="fields[gistCategories][]"> {{ option.label }}<br>
        {% endfor %}
    </ul>
{% else %}    
    <ul>
    {% for checkboxOption in entry.gistCategories %}
        {% set checked = false %}

        {% if checkboxOption.selected %}
            {% set checked = true %}

        {% endif %}

        {% if not checked %}
            <input type="checkbox" value="{{ checkboxOption.value }}" name="fields[gistCategories][]" {% if checked %} checked="checked"{% endif %}>{{ checkboxOption.label }}<br>
        {% endif %}

        <input type="checkbox" value="{{ checkboxOption.value }}" name="fields[gistCategories][]" {% if checked %} checked="checked"{% endif %}>{{ checkboxOption.label }}<br>
    {% endfor %}
    </ul>
{%endif%}

{{ getCsrfInput() }}
{% if entry.socialPush == true %}
    {% set socialPush = "Push to GistServers"%}
    {% set socialPushBtn = "default"%}
{% else %}
    {% set socialPush = "Push to GistServers"%}
    {% set socialPushBtn = "success"%}
{% endif %}

<button class="btn btn-{{socialPushBtn}}  btn-sm btn " style="margin:10px 15px 0 0;" type="submit" name="fields[gistDraft]" value="0">{{ socialPush }}</button>
</div> 

Now for screen caps showing behavior.

Before form submit

enter image description here

CP View after form submit

enter image description here

Frontend form after submit.

enter image description here

Ideally, After I submit the frontend form my users would be able to see all checkboxes again in case they need to change the selections. I am at a loss and would appreciate some rescue here.

3

The first loop you're using loops over entry.gistCategories.options, which contains all the options available. However, in the second loop (when entry.gistCategories|length !== 0), you're only looping over the options that have been selected.

Try this:

{% if entry.gistCategories | length == 0 %}
    <ul>
        {% for option in entry.gistCategories.options %}
            {# output checkboxes #}
        {% endfor %}
    </ul>
{% else %}  
    <ul>
        {% for checkboxOption in entry.gistCategories.options %}
            {# output checkboxes #}
        {% endfor %}
    </ul>
{% endif %}
2

Since the form was already submitted, your code is only looping through the checkboxes that were checked.

Just add .options to your second for block like you have above:

{% for checkboxOption in entry.gistCategories.options %}

That'll loop through all of 'em, checked or not.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.