default

Radios - Default

de meeste mensen kiezen benzine maar vanaf 50000 km per jaar is diesel goedkoper

required

Een verplichte keuze wordt in de markup aangegeven met .dso-required op de .form-group.dso-radios

Radiobuttons hebben (net zoals checkboxen) een fieldset.form-group als root element, geen div.form-group

Radios - Required

de meeste mensen kiezen benzine maar vanaf 50000 km per jaar is diesel goedkoper

invalid

Indien een radio groep ongeldig is, dient er een .dso-invalid class gezet te worden op de div met de class .dso-radios.

Radios - Invalid

Maak een keuze.

de meeste mensen kiezen benzine maar vanaf 50000 km per jaar is diesel goedkoper

valid

Indien een radio groep ongeldig was en valide wordt gemaakt, dient de .dso-invalid class vervangen te worden door de class .dso-valid.

Radios - Valid

de meeste mensen kiezen benzine maar vanaf 50000 km per jaar is diesel goedkoper

disabled

Radios - Disabled

de meeste mensen kiezen benzine maar vanaf 50000 km per jaar is diesel goedkoper

inline

Een keuze selectie tussen ja en nee vraagt om een inline variant. Dit is te bereiken door .dso-inline op .dso-radios te zetten.

Radios - Inline - Invalid

Maak een keuze.

Toelichting uitgeklapt

Een radio fieldset kan op twee plekken een info button krijgen. Naast de de vraag en per optie. Als een toelichting is opengeklapt moet er .dso-open op de toelichting button geplaatst worden.

Radios - Inline

Toelichting bij vraag: "Gaat het om de bouw van één of meer woningen?"

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam non metus dolor. Pellentesque velit arcu, pellentesque at lacus sit amet, porta semper est. Praesent mollis lorem lorem, non varius nisl lacinia et. Integer quis sollicitudin arcu. Nullam lacinia non ipsum sit amet varius. Praesent consequat ligula id tortor elementum pretium. Integer ligula justo, volutpat sed tellus eu, faucibus fringilla lectus.

Toelichting bij antwoord: "ja"

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam non metus dolor. Pellentesque velit arcu, pellentesque at lacus sit amet, porta semper est. Praesent mollis lorem lorem, non varius nisl lacinia et. Integer quis sollicitudin arcu. Nullam lacinia non ipsum sit amet varius. Praesent consequat ligula id tortor elementum pretium. Integer ligula justo, volutpat sed tellus eu, faucibus fringilla lectus.

Antwoord hier met "Ja" of "Nee"

Vaste toelichting

Een radio fieldset kan ook een vaste toelichting krijgen, naast de de vraag en per optie. Als een toelichting is opengeklapt moet er .dso-open op de toelichting button geplaatst worden.

Radios - Inline

Toelichting bij vraag: "Gaat het om de bouw van één of meer woningen?"

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam non metus dolor. Pellentesque velit arcu, pellentesque at lacus sit amet, porta semper est. Praesent mollis lorem lorem, non varius nisl lacinia et. Integer quis sollicitudin arcu. Nullam lacinia non ipsum sit amet varius. Praesent consequat ligula id tortor elementum pretium. Integer ligula justo, volutpat sed tellus eu, faucibus fringilla lectus.

Toelichting bij antwoord: "ja"

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam non metus dolor. Pellentesque velit arcu, pellentesque at lacus sit amet, porta semper est. Praesent mollis lorem lorem, non varius nisl lacinia et. Integer quis sollicitudin arcu. Nullam lacinia non ipsum sit amet varius. Praesent consequat ligula id tortor elementum pretium. Integer ligula justo, volutpat sed tellus eu, faucibus fringilla lectus.

Antwoord hier met "Ja" of "Nee"

Alle meldingen

Naar de meldingen wordt verwezen met een aria-describedby attribuut vanuit de fieldset.

Radios - Alle meldingen

Toelichting bij vraag: "Gaat het om de bouw van één of meer woningen?"

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam non metus dolor. Pellentesque velit arcu, pellentesque at lacus sit amet, porta semper est. Praesent mollis lorem lorem, non varius nisl lacinia et. Integer quis sollicitudin arcu. Nullam lacinia non ipsum sit amet varius. Praesent consequat ligula id tortor elementum pretium. Integer ligula justo, volutpat sed tellus eu, faucibus fringilla lectus.

Maak een keuze.

Antwoord hier met "Ja" of "Nee"