Any suggestions on best way to add radio buttons to Power Pages

[MJWhite]

I'm looking to replicate (as best I can) in Power Pages the radio buttons below which were created in Canvas apps:

I can't find anything close in either the standard or additional components in design studio.

Possible solutions might be:

- Cobbling together two ratings controls (each has a maximum of five options), but that would be clunky

- Inserting a Canvas apps component

- Any others?

Any thoughts on how to get the best outcome with the minimum effort?!

[Fubar · Accepted solution]

(you may need to do this from the Portal Management App) Create a Metadata record for the Form or Step in question, Type = attribute and use an appropriate Control Style 

https://learn.microsoft.com/en-us/power-apps/maker/portals/configure/configure-basic-form-metadata#c...

[MJWhite]

Thanks Fubar

Sorry for the delay in replying.  I has been a busy few weeks.

Have I understood correctly that the metadata record can only be created on a simple form, not any form, as per:

Configure basic form metadata for portals - Power Apps | Microsoft Learn ?

If so, have I understood correctly it is then necessary to somehow incorporate that simple form into a Dataverse form, which will subsequently be used by the Power Pages form, as per About basic forms - Power Apps | Microsoft Learn ?

If so, I'm struggling to do that because the instructions on the second link don't contain screenshots and are written for Portal webpages, not Power Pages.

Any help/guidance will be much appreciated.

Martin

[MJWhite]

Hi again

I had a support call and it looks like my mistake was that I hadn't configured the field as a choice field.  I had configured it as a number field.

I've still got some presentation issues, but will have a play around at the weekend and provide a fuller update when available.

Martin

[MJWhite]

Hi again

My mistake was that I hadn't configured the field as a choice field, so your suggestion was just what I needed.  The default positioning and spacing of the radio buttons and labels aren't very good (see screenshot), but I'll have a play with the Simple Form Metadata options and the Label and Description of the form field.

I'll accept your response as the solution shortly.  Much appreciated. 

Martin

[Bonez]

Hi,

Was wondering if you managed to change the spacing of these radio buttons. I am in a similar boat and was curious if you found a fix? Thanks

[MJWhite]

Hi there

Unfortunately not.  I started a work contract in April and then had a family illness and bereavement, so I haven't had the opportunity to do any more development in Power Pages.  I hope to start again soon.

Martin

[Bonez]

Hi,

That is all good I hope your family gets well! If you were interested here are some snippets of how I did simple spacing.

span label {
  padding-right: 45px;
}

span input[type="radio"] {
  margin: 5px 5px 5px 0px !important;
}

[MJWhite]

Thanks

I'll have a play when I next get the chance.  Good to know there's some way of improving the default spacing.

Martin

[ashishkapoor]

Hi Bonez,

Thanks for sharing an example. Where are these snippets added - on a basic form metadata level or at your custom css?