multi step form without click the next button

Hi @maryamait123

I hope you are doing good today.

The reason for this could be the core of the Forminator which needs to see that the next button was clicked in real and then it should sore those data from the previous step. I pinged our Forminator and SLS Team to review your query. We will post an update here as soon as more information is available.

Kind Regards,
Kris

Hi again @maryamait123

I hope you are doing good today.

We tested the above code and all seems to work fine and we are able to collect data.

Could you export your Forminator form, upload it to google drive or dropbox, and share a link in your next reply so that we could take a closer look at this?

Kind Regards,
Kris

Hello, thank you for your time, this is the page i need help with https://isowatt.fr/test/
i have to click twice to go to the next step, but i need to click just once.
also the data not collected because there is some fields can be visible only if i check the first checkbox but there not visible without clicking the next button
thank you

Hi @maryamait123

Could you export your form as mentioned in my last reply, upload it to google drive or dropbox, and share a link in your next reply. This will help us more to review this.

Kind Regards,
Kris

here is the link : https://drive.google.com/file/d/1AHS873V9zJuDcqrYdsNxiNsFrSso_sNo/view?usp=sharing

[ Please do not bump. ]

• This reply was modified 3 years, 4 months ago by Yui.
• This reply was modified 3 years, 4 months ago by Jan Dembowski.

Hello @maryamait123 ,

I’m sorry for the delay in response – we didn’t get an email notification about your last response ??

I’ve checked your code with your form and I was able to replicate the double click issue.
I’ll check with our second line developers if there is a way to change this with your form.

kind regards,
Kasia

Hello @maryamait123 ,

Please check this code snippet https://gist.github.com/wpmudev-sls/45e1629ea253386daab3f3600cc4314d
That should help you achieve your goal.

Or JS like that:

(function($) {

    $(document).ready(function() {
        setTimeout(function() {
            $('.forminator-custom-form').trigger('after.load.forminator');
        }, 100);

        $(document).on('after.load.forminator', function(e, form_id) {

            var next_button        = document.querySelector('.forminator-button-next'),
                click_event        = new CustomEvent('change_evt'),
                clickable_elements = document.querySelectorAll('.next-on-click .forminator-checkbox-label'),
                checkboxes         = document.querySelectorAll('.next-on-click input[type="checkbox"]');

            clickable_elements.forEach(
                clickable_element => {
                    clickable_element.addEventListener('click', wpmudev_clickables_event_callback)
                }
            )

            function wpmudev_clickables_event_callback() {
                if (typeof(next_button) != 'undefined' && next_button != null) {

                    checkboxes.forEach(checkbox => {
                        checkbox.addEventListener('change', wpmudev_change_evt_callback)
                    })
                }
            }

            function wpmudev_change_evt_callback(e) {
                if (e.currentTarget.checked) {
                    next_button.click();
                }
            }

        });

    });

})(jQuery);

kind regards,
Kasia

@wpmudev-support2 thank youuuuu it’s working like a charm