Adding a label outside of a radio button list row unique to that row

Gravity Support Forums » Plugin Support » Gravity Forms

matsilva
Member

I am looking to find a solution for creating a radio button list used for different products in a grid style format but I need to place a label outside of each row in that list.

For example I have 4 columns of radio buttons that I have styled into columns using your CSS ready classes. However each of these rows needs a label to identify what you are choosing because they are price choices for a product field.

Here is a link to an example
http://i49.tinypic.com/2afbwqh.png

as you can see the size labels are to the left of the row denoting the hierarchy of choices in the list.

Is there any way to achieve this in gravity forms?

Posted 11 years ago on Monday October 29, 2012 | Permalink
Kevin Flahaut
Administrator
This should be pretty simple.. just left float the label element for each field. You can set a width on the label to keep the alignment consistent and may need to tweak margins, padding, etc. depending on your application and theme styles.

here's a quick example..
```
[css]
body .gform_wrapper ul#gform_fields_22 li.gfield .gfield_label {
	width:100px;
	float:left;
	margin-top:0!important;
	color:#790000
}
```
screenshot: http://bit.ly/Sp5TnH
Posted 11 years ago on Monday October 29, 2012 | Permalink
matsilva
Member

Is this using 1 field list instead of separate ones for each row? I am asking because you wrote "label element for each field". What I am trying to avoid is the ability to tick more than one radio button by keeping all of these choices in 1 radio button field list.

Current the field labels for each row are unique to 1 field and you can't display multiple labels within 1 field list, only next to the radio buttons themselves.

Posted 11 years ago on Monday October 29, 2012 | Permalink
matsilva
Member

After reading my description I think I need to clarify that this is doable when you have multiple radio button fields stacked on top of each other in rows. That isn't what I am looking for because you can click on more than one radio button option (1 per row).

I am trying to avoid that so that I have a large grouping of radio buttons for different prices like my image example that match up to different size but you can only click on 1 radio button option. Each of the rows is organized to match up with a label but Gravity Forms doesn't seem to allow an extra label outside of a "faux" row created using the CSS ready clases.

Posted 11 years ago on Tuesday October 30, 2012 | Permalink
Chris Hajer
Key Master

Mat, I am going to close this topic and concentrate the support on the other topic of yours with a similar request: http://www.gravityhelp.com/forums/topic/unable-to-create-a-grid-price-field

Posted 11 years ago on Wednesday October 31, 2012 | Permalink

This topic has been resolved and has been closed to new replies.