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:
: 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.
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.
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.
Can u post the code?
You must be logged in to reply to this topic.
Welcome to the Advanced Custom Fields community forum.
Browse through ideas, snippets of code, questions and answers between fellow ACF users
Helping others is a great way to earn karma, gain badges and help ACF development!
🤔 Curious about the ACF user experience? So are we! Help guide the evolution of ACF by taking part in our first ever Annual Survey and guarantee you’re represented in the results. https://t.co/0cgr9ZFOJ5— Advanced Custom Fields (@wp_acf) May 8, 2023
© 2023 Advanced Custom Fields.