CODEWITHSUNDEEP
wordpresscontact-formgravity-forms-plugingravityforms
Bally Uppal
Bally Uppal

Reputation: 11

How to go on next page in gravity form without click on "next" button

i have created a Multi-pages survey form in "gravity form". By default its go on next page when i click on "Next" button. Is there any way to open next page with out click on "Next Button"

My form - http://dev23.cashframework.com/

For example if i choose "Purchase" option (radio Button) then automatically open next page of form.

I have tried to do that all through "Condition Logic" but no success

Upvotes: 1

Views: 8509

Answers (3)

parsa tajik
parsa tajik

Reputation: 11

You can use "Multi page auto advance for gravity forms" plugin. You can download it for free in wordpress.

Upvotes: 1

jackyboi
jackyboi

Reputation: 1

just to add to the first answer:

add this to your functions.php file

    add_action( 'wp_enqueue_scripts', 'autoprogress' );
function autoprogress() {
    wp_enqueue_script(
        'autoprogress', 
        get_template_directory_uri() . '/js/autoprogress.js', 
        array('jquery') /
    );
}

then create a JS file called autoprogress.js and create individual jquery functions for each radio section and next button (inspect the element). so #input_1_1, #input_1_2 etc

   $(function(){   
        jQuery('#input_#_# input:radio').change(function() {
            jQuery('#gform_next_button_#_#').trigger('click');
        });
    });

I wouldn't recommend hiding the next button as if the user goes back they cannot progress without selecting a new answer.

use this snippet to auto advance on already selected radio buttons

$(function(){   
    jQuery('#input_#_# input:radio').click(function() {
        jQuery('#gform_next_button_#_#').trigger('click');
    });
});

Upvotes: 0

Damian Smith
Damian Smith

Reputation: 95

You can use jQuery trigger to trigger the next button once the radio input has been changed:

$(function(){   
        jQuery('#input_1_2 input:radio').change(function() {
            jQuery('#gform_next_button_1_4').trigger('click');
        });
    });

You can then use CSS to hide the next button.

Upvotes: 3

Related Questions