Radio Button Layout

I am creating radio button group. But I want the radio buttons to be horizontal layout but in 4 columns. (see attached picture below)


This picture is the way I would like the “Model” radio button group layout to look. I tried creating 4 vertical groups but when I viewed the “live site” you were able to select an option in all 4 columns. I am wanting “the user” to only be able to select on option in the entire “Model” group (all 4 columns).

Could you please let me know how I can accomplish creating one radio button group with 4 columns or either be able to group these 4 vertical columns together. Thank you.

You can’t do that as just the one group as you can only either create radio buttons horizontally or vertically on your page.

The option you have is to have them displayed vertically so that you can place the appropriate picture alongside the group of checkboxes as per like above, however it will be reading down the page vertically and not horizontally as you wish to.

Or, as that will make the design not as you wanted it, simply change the radio buttons to dropdown lists and then the user can simply choose the dropdown option that they want instead of you having to have every model and price displayed on your user input form too.

Or, if you wanted to put in the legwork and do it through code, you could do something more elaborate and have all the option choices hidden until the user ticks a checkbox or selects a radio button for the type pf model that they want to have.

Then you can simply have that model options appear on the page as the radio button group as you had it above or as a simple dropdown list instead. Then all you would need to do is to collect the radio button or dropdown value and save this as a input into your dataset.

You can even setup code so that they can only select the one model type too, so that they can’t choose one model and then also choose another model, like you have already in your four radio button groups.

thanks