Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Example markup of Image Choices with a Product Option field
<li id="field_x" class="gfield gfield_price gfield_price_x gfield_option_x image-choices-field image-choices-use-images image-choices-show-labels image-choices-layout-horizontal ">
<label class="gfield_label">Field label</label>
<div class="ginput_container ginput_container_checkbox">
<ul class="gfield_checkbox" id="input_x">
<li class="gchoice_x image-choices-choice">
<input name="input_x" type="checkbox" value="Choice Label|1" checked="checked" id="choice_x">
<label for="choice_x" id="label_x" price=" +$ 1.00">
<span class="image-choices-choice-image-wrap" style="background-image: url(path/to/your/image);">
<img src="path/to/your/image" class="image-choices-choice-image" alt="Choice Label">
</span>
<span class="image-choices-choice-text">Choice Label</span>
<span class="image-choices-choice-price">
<span class="ginput_price"> +$ 1.00</span>
</span>
</label>
</li>
</ul>
</div>
</li>
@chrismccoy

This comment has been minimized.

Copy link

@chrismccoy chrismccoy commented Apr 7, 2020

how can we remove the + sign from the output on ginput_price

@jetsloth

This comment has been minimized.

Copy link
Owner Author

@jetsloth jetsloth commented Apr 8, 2020

how can we remove the + sign from the output on ginput_price

You can use the gform_format_option_label Javascript function. But it does need to be implemented a little differently since Image Choices also uses this function. Try something like

https://gist.github.com/jetsloth/301d0183ca85c8479bc4ca0b8b97e637

You can add that to a HTML field in your form, just make sure it's within <script></script> tags also. Or just take the code and add it to your theme or anywhere else you can add Javascript snippets to your site. Tweak as needed. The important parts are the very first line declaring gform_format_option_label_original and the return line calling gform_format_option_label_original

@chrismccoy

This comment has been minimized.

Copy link

@chrismccoy chrismccoy commented Apr 8, 2020

thanks that works, i was doing a hacky way of doing it, i was doing.

add_filter( 'gform_field_choice_markup_pre_render', function ( $choice_markup, $choice, $field, $value ) {
    if ( $field->type == 'option' ) {
            $new_string = sprintf( '>%s', GFCommon::to_money( $choice['price'] ) );
            return str_replace( ">{$choice['text']}", $new_string, $choice_markup );
    }
    return $choice_markup;
}, 10, 4 );

in combination of hiding the .ginput_price { display:none;}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment