I have a select field with 7 options and I want to replace these options with images.
Expected behavior: the user sees 7 image cards and clicks on an image to select the image.
Based on another thread, this is possible for radio button fields with an image tag in the display text field -
1) https://toolset.com/forums/topic/add-images-to-radio-button-options/
2) https://toolset.com/forums/topic/use-images-in-cred-select-field-and-enable-click-to-select-option/
I tried the same process to replace the text with an image on the select field but the image tag does not get saved.
I then tried to make the same change on a radio field but the IMG was not saved.
<img src="<em><u>hidden link</u></em>"/>
Field I want to change: hidden link
I try to make changes by inserting the src tag:
hidden link
When I try to save the image tag in one option (consumer), the image does not get saved and the field becomes blank.
What am I missing, why is the src tag not getting saved in the display field?
If image tags cannot be saved in the display text field, what can I do to replace the select field/ radio button with images?
I am on US time so please feel free to pass this ticket to Christian.
Hello, as of Types 3.3.4, you must include an additional custom code snippet to enable HTML content in custom field options. This solution is intended for use in radio fields:
add_filter( 'types_sanitize_field_labels', '__return_false' );
See more information about this in our erratum post:
https://toolset.com/errata/html-in-toolset-custom-field-labels-is-stripped-when-saving-the-fields/
I've updated the other relevant ticket to include this information, since others may search and find the solution there in the future.
Chris,
Thanks a lot. Can this solution work for Select fields? If not, is there a workaround to make it work for select fields?
I have been using select fields and slugs of these fields are used in a lot of custom code to retrieve data. I would prefer to keep using a select field if possible.
Regards,
Himanshu
No I do not expect this to work for select fields. Browsers are not required to support image tags inside HTML select options. Anything in an option tag other than "nothing" or "text" would be invalid HTML, per the spec:
https://html.spec.whatwg.org/multipage/form-elements.html#the-option-element
There is issues with update on tickets.
I have submitted an update and it does not show up so I am going to type it again.
Can this work for Select fields? I am already using a bunch of them and calling the field slug in custom code to retrieve data.
Is there a workaround to use select fields instead of radio buttons?
Thanks. Let me work on this using your feedback and get back to you.
Sure, I will stand by for your update.
It works. Thanks, Christian. My issue is resolved now.
