Breadcrumbs Widget | Numerical steps option: Numbers are skipped when some pages are hidden

Hallo,

ich nutze ein klassisches Formular mit dem Widget Breadcrumbs. Die Breadcrumbs sind auf nummerisches Zählen eingestellt. Im Formular gibt es eine Bedingung, die eine Seite (Seite 6) ggf. ausblendet.

Die Breadcrumbs reagieren korrekt auf die Aus- und Einblendung der Seite über die Bedingung.

Allerdings ist die Navigation verwirrend, wenn die Seite ausgeblendet ist:

Die Ausfüllenden vermissen die Seite 6.

Ist es möglich, die Zählung dynamisch anzupassen?

Hi Koch_Barbara,

Thanks for reaching out to Jotform Support. Unfortunately, our German Support agents are busy helping other Jotform users at the moment. I'll try to help you in English using Google Translate, but you can reply in whichever language you feel comfortable using. Or, if you'd rather have support in German, let us know and we can have them do that. But, keep in mind that you'd have to wait until they're available again.

Now, let me help you with your question.

As per checking, I can confirm that the Breadcrumbs widget on your form is having an issue with the numerical steps once it skips a page on your form. I have tried ways if there are options that we can change the numbering of the widget. Unfortunately, this option is not available as of now. Thus, I have escalated your concern to our development team for checking. I cannot give you an ETA as to when the issue will be resolved but we will inform you via this support thread as soon as we hear from them.

As a workaround, you can try using the Progress Bar widget so the users can still see the progress of filling in the form before they can submit it.

Give it a try and let us know if you have any other questions.

Thanks for forwarding the problem to your development team.
As our form has a lot of not mandatory questions unfortunately the Progress Bar widget is not an option.

As workaround I changed the number of the hidden/not hidden page to a word and mark it in a different color to make the "special page" more visible before it is hidden.

So far I use this css

#form-tab-6 .se-no {
visibility: hidden;
position: relative;
}

#form-tab-6 .se-no::before {
visibility: visible;
position: absolute;
content: "urban";
top: 0;
left: -10px;
color: #65ad30;
font-size: 18px;
}

I would like to change this color after you've reached page 6 to white. Is there a way to do this?

At the moment:

Desired result:


Thanks a lot for your help!

Hello Barbara,

Thanks for getting back to us. Please try inserting the custom CSS code below:

.se-active .se-no::before {

  color: #fff !important;

}

Here's the result:

Give it a try and let us know how it goes.

Perfect.

Thanks a lot!

Hello Barbara,

We apologize for the inconvenience this caused. We have updated the widget and the issue has been resolved. Please check out and let us know if you need further assistance. Thank you for reporting the issue. Have a good day.

Regards,

Widgets Team

Great, thanks a lot!

Unfortunately I am struggeling at one point:
If I assign the breadcrumb widget for the first time, the new dynamic counting isn't shown. If I assign the widget a second time everything is okay.

It doesn't help to delete the first widget. I only get the intended result if I assign the widget twice. Did I miss anything?

Hello Barbara,

I checked your form, and the numbers appear to be in the correct sequence. Please take a look at the screenshot below:

We can hide the first widget using CSS code. Please use the code below:

.form-all .se-main-progress:first-child {

  display: none !important;

}

Give it a try and let us know how it goes.

Great, everything is fine.

Thanks a lot for your efforts!
Barbara