Hello,
I have a checkbox field with a return value of Both (Array). This checkbox has 4 options. In my template I want to display all options, but add a class to one that selected. This way I can color code the ones that were selected.
So to help visualize what I’m trying, lets say I have the following checkbox options
one : Option 1 (Checked)
two : Option 2
three : Option 3 (Checked)
four : Option 4 (Checked)
As you see here, 3 of the 4 options were checked. I put the word checked in parenthesis to show that it had been select…its not part of the label.
Now in my template, this the outputted HTML I’m trying to achieve:
<ul>
<li class="checked">Option 1</li>
<li>Option 2</li>
<li class="checked">Option 3</li>
<li class="checked">Option 4</li>
</ul>
I’m good with normally looping through the options to only show the options that were selected. But I’m struggling a bit to show all of them, selected or not, but add a class to the ones that are selected.
Any help would be greatly appreciated.
Sorry forgot to show you what I have tried so far. I found someone asking a similar question in forum https://support.advancedcustomfields.com/forums/topic/checkbox-how-to-display-all-item-as-check-uncheck/
I used the code in the reply marked as solved, but are getting errors.
Here’s my PHP code:
<?php
$value = get_field('service_options');
$field = get_field_object('service_options');
$choices = $field['choices'];
if( $field ) :
?>
<ul>
<?php
foreach($choices as $value => $label) :
if( in_array($value, $values) ) :
$class = ' class="selected"';
else :
$class = '';
endif;
echo '<li' . $class . '>' . $label . '</li>';
endforeach;
?>
</ul>
<?php endif; ?>
But I’m getting the following warning for each option:
Warning
: in_array() expects parameter 2 to be array, null given in …
In addition to the warning on each item, , the class selected isn’t being added to the options that were selected.
Sorry for constant messages, I’m trying to work on this while I wait on a reply.
Ok, realized I had a typo on the $value variable, needed to be plural like I used in the foreach loop
$value = get_field('service_options');
Should have been
$values = get_field('service_options');
That took care of the warning, but is still not assigning the checked class to the ones that are checked.
Getting closer!
Alight, still having a conversation with myself lol.
I’m getting closer. I hadn’t seen the second code snippet John Huebner provided. This is the code I have now.
<?php
$values = get_field('service_options');
$field = get_field_object('service_options');
$choices = $field['choices'];
?>
<ul>
<?php
foreach($choices as $choice_value => $choice_label) :
foreach ( $values as $value ) :
if( $value['value'] == $choice_value ) :
$class = ' class="checked"';
else :
$class = '';
endif;
endforeach;
echo '<li' . $class . '>' . $choice_label . '</li>';
endforeach;
?>
</ul>
But it’s only working on one of the options. So if I check 3 options, it will only assign the ‘checked’ class to last checked option. So if I checked option 1, 2 and 4. The outputted html will only add the checked class to the option 4.
So close!
Try moving $class = ”; to before the second foreach loop.
@lynx_gd You rock!!! That did it, and completely makes sense now that I think about.
Thank you very much!
Sorry @lynx_gd , I accidentally clicked on my last reply as the solved answer. It should be your answer, but can’t figure out how to undo.
