Contact Form 7 Auto Save Progress – compatibility issue

[Levi]

Hi Dines,

I also bought this plugin: https://codecanyon.net/item/contact-form-7-multistep-pro/19635969?ref=rednumber
And:
I installed this plugin too (important plugin for me): https://codecanyon.net/item/contact-form-7-auto-save-progress/22449041 …than:

Issue:
There is just one required chackbox on the first step. I clicked next button… than on the secondary step I start filling in the form fields and during refresh the page. The form is jumping to the first step, I try to click the next button but it don’t step to the secondary step.

Screenshot of the issue:
https://drive.google.com/file/d/1Wozwo-yVtiMU7SAt6_Tykrg-WhbhVLza/view?usp=sharing

Thank you for your help.

Regards,
Levi

(Contact form 7 code. I conbinate this code other plugin):

1. step
<h4 style="color:#f7b500;">10 év jótállási feltételek</h4>

<p style="margin-bottom:10px"><strong>1.</strong> Kizárólag újonnan vásárolt Gree magasoldalfali lakossági berendezések regisztrálhatóak. (cikkszám kezdete: GWH)</p>

<p style="margin-bottom:10px"><strong>2.</strong> A beltéri egység sikeres regisztrációja a vele azonos hűtőkörre kötött kültéri egységre is vonatkozik.</p>

<p style="margin-bottom:10px"><strong>3.</strong> Technológiai felhasználásra vásárolt (például: szerverhűtés; gyártás vagy termelés hűtése; magas gőz, vagy korrozív anyagokkal terhelt)  vagy magas párakitettségű helyiségek hűtésére-fűtésére (például: medence- és pince térben, wellness helyiségben) alkalmazott  berendezések nem regisztrálhatóak.</p>

<p style="margin-bottom:10px"><strong>4.</strong> A 10 évig kiterjesztett jótállás kizárólag Magyarország területén telepített, valamint a Cool4u Kft., mint hivatalos magyarországi Gree képviselet által forgalomba hozott készülékekre vonatkozik.</p>

<p style="margin-bottom:10px"><strong>5.</strong> A készülék telepítését érvényes klímaszerelési engedéllyel (adószámmal és F-gáz engedéllyel) rendelkező magyarországi egyéni vállalkozó vagy gazdasági társaság végzi.</p>

<p style="margin-bottom:10px"><strong>6.</strong> A jótállás a készülék rendszeres karbantartásához kötött, melynek a részleteit a kezelési kézikönyv tartalmazza.</p>

<p style="margin-bottom:10px"><strong>7.</strong> A 10 éves időtartamba beletartozik a 3 év alap jótállás is. A jótállás kezdő időpontja az üzembe helyezés napja. Ha az üzembe helyezés a vásárlást követő hat hónapon túl történik, akkor a jótállás kezdő időpontja a termék vásárlásának a napja lesz.</p>

<p style="margin-bottom:10px"><strong>8.</strong> Amennyiben valósággal nem egyező adatokkal történik a regisztráció, még sikeres regisztráció esetén is a kiterjesztett jótállás azonnali megszüntetését vonja maga után.</p></br>

<div class="checkbox-1">
[checkbox* checkbox-82 use_label_element "A jótállási feltételeket elolvastam és elfogadom."]
</div>
</br>

2. step
<h4 style="margin-bottom:0px;color:#f7b500;">REGISZTRÁCIÓ</h4>
<label>[text* id:name-id-1 minlength:2 maxlength:190 placeholder "NÉV *"]</label>

<label>[email* id:email-id-1 placeholder "E-MAIL CÍM *"]</label>

<label>[text* id:adoszam-id-1 class:adoszam minlength:13 maxlength:13 class:RegEx-13552 placeholder "BEÜZEMELŐ CÉG ADÓSZÁMA *"]</label>

<p style="margin-bottom:-25px;margin-top:25px;font-size: 14px;line-height: 25px;font-weight: 400;color: #f7b500;">Beltéri egység adatai</p>
<label>[text* cikkszam-id-1 maxlength:18 class:RegEx-13550 placeholder "CIKKSZÁM *"]
<span style="color:#959494; font-size:12px;float: left;margin-top:0px;margin-bottom:0px;line-height: 15px;">(A beltéri egység oldalán található kis fehér matrica felső karaktersora)</span></label>

<label>[text* szeriaszam-id-1 maxlength:13 class:RegEx-13551 placeholder "SZÉRIASZÁM *"]
<span style="color:#959494; font-size:12px;float: left;margin-top:0px;margin-bottom:0px;line-height: 15px;">(A beltéri egység oldalán található kis fehér matrica alsó karaktersora)</span></label>

</br></br>
<p style="color:#959494; font-size:13px;">A betléri egységen található matrica mintája</p>
<div class="help-image">
<img src="https://gree-magyarorszag.hu/wp-content/uploads/2020/06/segedlet-címke.png" width="356" height="auto">
</div>
</br>

[group chackbox2 clear_on_hide]
[checkbox checkbox-show-more2 exclusive default:0 use_label_element "További beltéri egységet regisztrálok"]
[/group]

[group group-2 clear_on_hide]
<p style="margin-bottom:-25px;margin-top:25px;font-size: 15px;line-height: 25px;font-weight: 400;color: #f7b500;">2. Beltéri egység adatai</p>
<label>[text*  cikkszam-id-2 minlength:16 maxlength:18 class:RegEx-13550 placeholder "CIKKSZÁM *"]</label>
<label>[text*  szeriaszam-id-2 class:RegEx-13551 minlength:13 maxlength:13 placeholder "SZÉRIASZÁM *"]</label>
[/group]

[group chackbox3 clear_on_hide]
[checkbox checkbox-show-more3 default:2 use_label_element "További beltéri egységet regisztrálok"]
[/group]

[group group-3 clear_on_hide]
<p style="margin-bottom:-25px;margin-top:25px;font-size: 15px;line-height: 25px;font-weight: 400;color: #f7b500;">3. Beltéri egység adatai</p>
<label>[text*  cikkszam-id-3 minlength:16 maxlength:18 class:RegEx-13550 placeholder "CIKKSZÁM *"]</label>
<label>[text*  szeriaszam-id-3 class:RegEx-13551 minlength:13 maxlength:13 placeholder "SZÉRIASZÁM *"]</label>
[/group]

[group chackbox4 clear_on_hide]
[checkbox  checkbox-show-more4 default:2 use_label_element "További beltéri egységet regisztrálok"]
[/group]

[group group-4 clear_on_hide]
<p style="margin-bottom:-25px;margin-top:25px;font-size: 15px;line-height: 25px;font-weight: 400;color: #f7b500;">4. Beltéri egység adatai</p>
<label>[text*  cikkszam-id-4 minlength:16 maxlength:18 class:RegEx-13550 placeholder "CIKKSZÁM *"]</label>
<label>[text*  szeriaszam-id-4 class:RegEx-13551 minlength:13 maxlength:13 placeholder "SZÉRIASZÁM *"]</label>
[/group]

[group chackbox5 clear_on_hide]
[checkbox checkbox-show-more5 default:0 use_label_element "További beltéri egységet regisztrálok"]
[/group]

[group group-5 clear_on_hide]
<p style="margin-bottom:-25px;margin-top:25px;font-size: 15px;line-height: 25px;font-weight: 400;color: #f7b500;">5. Beltéri egység adatai</p>
<label>[text*  cikkszam-id-5 minlength:16 maxlength:18 class:RegEx-13550 placeholder "CIKKSZÁM *"]</label>
<label>[text*  szeriaszam-id-5 class:RegEx-13551 minlength:13 maxlength:13 placeholder "SZÉRIASZÁM *"]</label>
[/group]

[group chackbox6 clear_on_hide]
[checkbox checkbox-show-more6 default:0 use_label_element "További beltéri egységet regisztrálok"]
[/group]

[group group-6 clear_on_hide]
<p style="margin-bottom:-25px;margin-top:25px;font-size: 15px;line-height: 25px;font-weight: 400;color: #f7b500;">6. Beltéri egység adatai</p>
<label>[text*  cikkszam-id-6 minlength:16 maxlength:18 class:RegEx-13550 placeholder "CIKKSZÁM *"]</label>
<label>[text*  szeriaszam-id-6 class:RegEx-13551 minlength:13 maxlength:13 placeholder "SZÉRIASZÁM *"]</label>
[/group]

[group chackbox7 clear_on_hide]
[checkbox checkbox-show-more7 default:0 use_label_element "További beltéri egységet regisztrálok"]
[/group]

[group group-7 clear_on_hide]
<p style="margin-bottom:-25px;margin-top:25px;font-size: 15px;line-height: 25px;font-weight: 400;color: #f7b500;">7. Beltéri egység adatai</p>
<label>[text*  cikkszam-id-7 minlength:16 maxlength:18 class:RegEx-13550 placeholder "CIKKSZÁM *"]</label>
<label>[text*  szeriaszam-id-7 class:RegEx-13551 minlength:13 maxlength:13 placeholder "SZÉRIASZÁM *"]</label>
[/group]

[group chackbox8 clear_on_hide]
[checkbox checkbox-show-more8 default:0 use_label_element "További beltéri egységet regisztrálok"]
[/group]

[group group-8 clear_on_hide]
<p style="margin-bottom:-25px;margin-top:25px;font-size: 15px;line-height: 25px;font-weight: 400;color: #f7b500;">8. Beltéri egység adatai</p>
<label>[text*  cikkszam-id-8 minlength:16 maxlength:18 class:RegEx-13550 placeholder "CIKKSZÁM *"]</label>
<label>[text*  szeriaszam-id-8 class:RegEx-13551 minlength:13 maxlength:13 placeholder "SZÉRIASZÁM *"]</label>
[/group]

[group chackbox9 clear_on_hide]
[checkbox checkbox-show-more9 default:0 use_label_element "További beltéri egységet regisztrálok"]
[/group]

[group group-9 clear_on_hide]
<p style="margin-bottom:-25px;margin-top:25px;font-size: 15px;line-height: 25px;font-weight: 400;color: #f7b500;">9. Beltéri egység adatai</p>
<label>[text*  cikkszam-id-9 minlength:16 maxlength:18 class:RegEx-13550 placeholder "CIKKSZÁM *"]</label>
<label>[text*  szeriaszam-id-9 class:RegEx-13551 minlength:13 maxlength:13 placeholder "SZÉRIASZÁM *"]</label>
[/group]

[group chackbox10 clear_on_hide]
[checkbox checkbox-show-more10 default:0 use_label_element "További beltéri egységet regisztrálok"]
[/group]

[group group-10 clear_on_hide]
<p style="margin-bottom:-25px;margin-top:25px;font-size: 15px;line-height: 25px;font-weight: 400;color: #f7b500;">10. Beltéri egység adatai</p>
<label>[text*  cikkszam-id-10 minlength:16 maxlength:18 class:RegEx-13550 placeholder "CIKKSZÁM *"]</label>
<label>[text*  szeriaszam-id-10 class:RegEx-13551 minlength:13 maxlength:13 placeholder "SZÉRIASZÁM *"]</label>
[/group]
</br>

3. (finish) step
<h4 style="color:#f7b500;">Adatok áttekintése és beküldés</h4>
[step_confirm]
</br>
<hr style="height:1px;border-width:0;color:#eee;background-color:#eee">
</br>
<div class="checkbox-2">
[acceptance term_and_conditions class:required acceptance_as_validation: on] AZ <a style="color:#959494" href="https://gree-magyarorszag.hu/wp-content/uploads/2020/11/Cool4U_kiterjesztett_garancia_ak_tajekoztato_1_0_nc.pdf" target="_blank">ADATKEZELÉSI TÁJÉKOZTATÓBAN</a> FOGLALTAKAT ELOLVASTAM ÉS ELFOGADOM.[/acceptance]
</div>
</br>

<script language="javascript">
jQuery(document).on('click', '.wpcf7-submit', function(e){
if( jQuery('.ajax-loader').hasClass('is-active') ) {
e.preventDefault();
return false;
}
});
</script>

<div class="submit-on">
[submit "BEKÜLDÉS"]
</div>

[Dinesh]

Hi Levi,

There are multiple addons being used here. So unable to find the exact cause just checking the snapshot. Any chance you can create a staging site for me ? I will play around and try to find the cause of it. Seems like JS error and hopefully we can fix it.

Thanks

[Tilo]

@Levi
the plugin is a real disaster, see codecanyon.net/item/contact-form-7-multistep-pro/reviews/19635969
I have also used it, but if I need support, there is no way. The plugin doesn’t work fine, so I get this one argthemes.com/contactform7multistep/. It works not perfect, but much better.

@Dines
I have written you an e-mail at 30.11.2020. Do you have seen it?

Thanks
Tilo

[Dinesh]

Hi Tilo,

I haven’t got any email regarding the jQuery validation. I tried searching using your email and couldn’t find it. What was it related to ?

Thanks

[Author]

Posts