Today I came across an interesting use case. I had a customer that had multiple radio button fields in his form. Each field has in turn different choices. He only wanted visitors to select one radio button across all the different fields.
Use case example
Field A has three choices (1,2,3)
Field B has three different choices (4,5,6)
Field C has three different choices (7,8,9)
When the user selects from Field A but later also selects something from field C then we want the selection in field A to be removed (unselected). This is exactly what this small jQuery snippet can do for you!
How do I enable this?
1. Check the requirements
This snippet works only in combination with Gravity forms so you will need to have Gravity Forms installed and activated.
2. Add css class.
Each radio field that needs to use this functionality will need the same css class. Navigate to the appearance tab of your field and add “gotr_limit_radio” to the css class box.
3. Add snippet.
Simply copy the snippet to an html field and make sure you wrap it between <script> Snippet goes here </script>
Reach out by leaving a comment or send me a message through the contact form