Support

Account

Register Login

Home › Forums › Feature Requests › Making a image selection field with Conditional Logic

Solving

Making a image selection field with Conditional Logic

  • I am wanting to make a new field type for image selections (a radio select field, but with images).

    How can I start. Should I make it based off of the default select field in order to be able to have it usable with conditional logic?

    I have tried to create from the custom field template, but I cannot get conditional logic to work. Any Ideas?

  • I’m not sure why you need to build a new field type. I would do something like this.

    https://support.advancedcustomfields.com/forums/topic/is-there-an-image-radio-field/

  • Thanks John.
    And I am familiar with that post. But I want to use conditional logic.

  • I would think that this should be a main feature with the radio field.

  • Conditional logic in ACF is not a function of a specific field that conditions are based on. Conditional logic is a function of the fields that are conditional. There isn’t anything in the radio field that says “I can be used for conditional logic”

    In order to add your field type to the fields that can be used for conditional logic you would need to alter the conditional logic section field that is available in all field types and you would need to build custom JavaScript to allow choosing your field. I can’t give you the details on this as I don’t know them. You’d need to dig through the ACF code to figure out if this is even possible.

  • Thanks John.
    SO acf-input.js starting at Line 9700 is where the Conditional Logic is happening..

    There is also where certain fields are allowed.

    If we can simply hook into the js functions and add our custom field to the array I guessing this should work in custom fields.

    About the radio/checkbox fields. I think there should be a setting that allow users to assign a image instead of a check or a dot.

    Kinda like:

    Choices:
    red : Red : /images/red.png
    yellow : Yellow : /images/yellow.png

  • If you want this built into the current field then I’d suggest contacting the developer. https://www.advancedcustomfields.com/contact/. The more requests the developer gets the more likely he is to think about adding a feature.

    I am a developer, when I need something like this I generally work with what’s already in ACF and use filters and add customization for specific fields.

    You can already do basically what you are asking by specifying images for labels and then just add some customization using css/js

    
red : <img src="url-of-red.jpg">
yellow : <img src="url-of-yellow.jpg">

    It may be possible to .extend the other fields to modify the conditional logic. I think I’ve tried this in the past. I don’t remember who it turned out and I can’t find it in my archives.

    If I needed to do this a lot I might consider adding a custom field setting to the existing field type https://www.advancedcustomfields.com/resources/adding-custom-settings-fields/ and then use an acf/render_field filter to modify the choices displayed and then add custom CSS and JS as needed by using a specific class for the field wrapper. I might even go as far as making my new field setting dynamic based on the values entered into the ACF choices field using custom JS. Nearly any field type built in to ACF can be used as a field setting in any other field type. As an example if you take a look at my medium editor plugin, this field type that I build uses a repeater field as one of its field settings. It is even possible to use an image field as a field setting https://support.advancedcustomfields.com/forums/topic/default-value-for-images/. Taking it a little further you could have a radio field as a field setting that toggles between standard input and image input and then dynamically populate the built in ACF choice field base on whatever is entered into the custom field settings for images.

    Sorry, I may have gone off in many directions, just trying to help give you options on how to get to where you want to go without building a new field that would require hacking the ACF files.

  • @hube2 The problem with this:

    red : <img src="url-of-red.jpg">
yellow : <img src="url-of-yellow.jpg">

    Is that , when adding post type, it saved the value (red or yellow)

    When you want to load the public page to include the Image (<img..) , you don’t get it , so you end up getting the value only

  • Most select fields have an option to return the value, label of both.

Viewing 9 posts - 1 through 9 (of 9 total)

The topic ‘Making a image selection field with Conditional Logic’ is closed to new replies.