Gravity Forms: Submit Form When Radio Button is Selected

THIS POST MAY CONTAIN AFFILIATE LINKS. PLEASE READ OUR DISCLAIMER FOR MORE INFO.

In this tutorial, I’ll show you how to use a Radio field to submit a form built with Gravity Forms. I will also demonstrate how to use conditional logic Confirmations to vary the action when the form is submitted.

How it works

With this solution, you will be replacing the need for the submit button on your form.

Instead of using the submit button, each choice in your radio field will complete the action of submitting the form.

You can use a single radio button or have a list of several radio buttons and use confirmation conditional logic to control what happens when that form is submitted.

What you’ll need

In order for this to work you will need the following.

Usage

The snippet below will create the magic.

Place the code directly in the form inside an HTML block.

Putting this JS code in the an HTML field will prevent this function from being triggered by another form on your site.

The Conditional Logic

This radio button has four different confirmation results.

Will The Entries Still Be Recorded?

Yes. The submission action will work the same as it would if you were to use a button.

  1. Form entries will be recorded
  2. Confirmation action performed (message, page, redirect)

Removing the Form Button

In this case, it makes sense to remove the form button because I want the submission to be created by the radio button choice. So we will need a simple CSS snippet, shared below.

Be sure to replace ID, with your form ID number (i.e #gform_wrapper_12)

Put this code in your themes style.css file or in the Customizer in Appearance => Customize => Additional CSS

Learn how to add the code to your site using a functionality plugin.

Important: Do NOT Enable Ajax

When adding the form to you page, it is important that you do NOT enable Ajax. This will break the radio button magic.

When using the Gravity Forms shortcode, make sure ajax=”false”:

Questions? Issues?

For assistance with this, please use the comments below!

4.5 2 votes
Article Rating
Subscribe
Notify of
guest

0 Comments
Inline Feedbacks
View all comments