Accessibility Widget: Duplicate 'All fields marked with * are required' message appears

Hi, I am seeing duplicate "All fields marked with * are required and must be filled." satements when I add the Accessibility widget, please see below. My URL is SAC-Process Server Registration Individual_dev_new

I followed the following instructions from the Chatbot including adding the CSS statement. Please see below conversation...

Hi, I’m Podo, an AI Agent from Jotform Support. How can I help you today?

You said:

When I add the accessibility widget to a form I get the text "All fields marked with are required and must be completed.*" appearing multiple times.

Podo said:

To fix the repeated accessibility text, you’ll need to remove the extra copies from your Form Warnings.

1. In the Form Builder, go to the Settings tab, click Show More Options, scroll down to Form Warnings, then click Edit.
2. In the list of warnings, look for the message that says “All fields marked with * are required and must be completed.” (or similar), delete any duplicate entries or extra text you see there, then click Save and test the form again.*

You said:

I did that and it is still showing multiple "All fields marked with are required and must be completed.*"

Podo said:

Let’s narrow this down to where the extra messages are coming from.

1. In Form Builder, go to Settings → Form Settings → Show More Options → Form Warnings → Edit, then use the search box to look for the text All fields marked with and confirm it appears only once and is not duplicated in any other warning type.
2. Next, check if you have the Accessibility widget added more than once or if you cloned fields/pages that might include it, and if so, remove the extra widget instances, then preview the form again.

You said:

Message appears only once and there is only one accessibility widget on the form.

Podo said:

Let’s try the two most common causes when warnings and the accessibility helper both inject similar text.

1. In Settings → Form Settings → Show More Options → Form Warnings → Edit, temporarily change that message to something very unique (for example: REQUIRED-FIELDS-MESSAGE-TEST), click Save Changes, then preview the form and confirm whether that unique text is also repeated multiple times.
2. If it is, remove the Accessibility widget from the form, preview again to see if the repetitions stop, then re-add the widget and test once more; if the duplicates still appear after that, please share the form URL or ID so we can check if this is a form-specific issue or a bug we need to escalate.

You said:

When I change the text to something unique it does not appear on the form. The uhttps://form.jotform.com/AvenuGRM/ProcessServerNaturalPerson_dev_newwwwwwwwwwwwwwwwwwww

Podo said:

Since the unique text doesn’t appear at all, the repeated line you see is coming entirely from the Accessibility widget itself, not from your Form Warnings, so the clean workaround is to hide those extra lines with CSS.

1. In Form Builder, go to Form Designer (paint roller icon) → Styles → Inject Custom CSS, then add CSS that targets and hides the repeated notice text (for example, a rule that hides the specific paragraph or list items under the accessibility helper that contain All fields marked with * are required and must be completed.), click Save, and then preview the form.
2. If you’d like, I can suggest an exact CSS selector, but I’d need you to temporarily leave the form public as it is now and confirm whether the repeated lines are all visually identical (same font/size/position) or if one of them looks slightly different so we only hide the duplicates and keep one copy visible.*

You said:

Please suggest an exact css selector.

Podo said:

To hide the repeated accessibility notice, inject CSS that targets the extra instances while keeping one visible.

1. In Form Builder → Form Designer → Styles → Inject Custom CSS, add this code in your main form (not the widget): /* Keep the first occurrence, hide the rest */ .form-description:contains("All fields marked with * are required and must be completed.") ~ .form-description { display: none !important; }
2. Click Save and preview the form; if your theme uses a different class than .form-description for that text, let me know what element it’s inside (or copy a small HTML snippet), and I’ll adjust the selector accordingly.*

You said:

I am out of the from.

Podo said:

To fix this, you’ll need to add CSS once you’re back inside the form builder; here’s exactly what to do when you can edit the form again.

1. Open your form in Form Builder, click the Form Designer (paint roller icon), go to the Styles tab, and in Inject Custom CSS paste this code: /* Hide duplicate accessibility notice lines */ .accessibility-helper * { /* keep first occurrence visible, hide the rest if they repeat the same text */ }
2. Since I can’t inspect your exact HTML from here, when you’re next in the form please right‑click the repeated text in Preview → Inspect, copy the surrounding tag and class (for example, something like .accessibility-helper p or .form-description), and send that snippet so I can give you a precise selector like .accessibility-helper p:nth-of-type(n+2) { display:none !important; } that will hide only the extra copies.*

Is this conversation h

Hi,

Based on the information you provided and the previous conversation, the duplicate "All fields marked with * are required and must be completed." message is coming from the Accessibility widget itself, not from your Form Warnings.

To hide the duplicate messages while keeping one visible, you can add this exact CSS selector in your form:

In Form Builder, go to Form Designer (paint roller icon) > Styles > Inject Custom CSS, then add the following code:

/* Keep the first occurrence, hide the rest */
.form-description:contains("All fields marked with * are required and must be completed.") ~ .form-description {
display: none !important;
}

If your form uses a different class than .form-description for that text, you can inspect the element in Preview mode, copy the surrounding tag and class (for example, .accessibility-helper p), and I can help you adjust the selector accordingly.

This CSS will hide all duplicate lines except the first one, resolving the visual duplication issue caused by the Accessibility widget.

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

I tried and still showing duplicates.

Hi,

Since the suggested CSS solution did not resolve the issue and duplicates are still showing, this might be a more specific form-related issue or a bug with the Accessibility widget.

Our support team will take over from here to investigate and provide a solution.

Thank you for your patience.

It seems to be working now. I restored a backup of the form and re-added the Accessibility widget and it started working without giving the duplicate text. - Thanks

Sorry, it is not working.

If there is a Section Collapse control after the Accessibility widget and the Section Collapse is set to be visible, I get duplicate All fields marked with * are required and must be completed." text.

Hi AvenuGRM,

Could you try adding the custom CSS below to your existing form custom CSS instead? Here’s the code:

#requirement_description_0 {

  display: block !important;

}



#requirement_description_1 {

  display: none !important;

}

Also, to keep the conversation organized, I moved your other question to its own thread, and someone from our Support Team will help you with it here.

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