diff --git a/src/registrar/assets/src/js/getgov/domain-purpose-form.js b/src/registrar/assets/src/js/getgov/domain-purpose-form.js index 7cde5bc35..54a590ed2 100644 --- a/src/registrar/assets/src/js/getgov/domain-purpose-form.js +++ b/src/registrar/assets/src/js/getgov/domain-purpose-form.js @@ -1,8 +1,16 @@ import { showElement } from './helpers.js'; +// Flag to track if we're in the initial page load +let isInitialLoad = true; + export const domain_purpose_choice_callbacks = { 'new': { - callback: function(value, element) { + callback: function(value, element, event) { + // Only clear errors if this is a user-initiated event (not initial page load) + if (!isInitialLoad) { + clearErrors(element); + } + //show the purpose details container showElement(element); // change just the text inside the em tag @@ -13,29 +21,98 @@ export const domain_purpose_choice_callbacks = { 'Include any data that supports a clear public benefit or ' + 'evidence user need for this new domain. ' + '*'; + + // Mark that we're no longer in initial load + isInitialLoad = false; }, element: document.getElementById('purpose-details-container') }, 'redirect': { - callback: function(value, element) { + callback: function(value, element, event) { + // Only clear errors if this is a user-initiated event (not initial page load) + if (!isInitialLoad) { + clearErrors(element); + } + // show the purpose details container showElement(element); // change just the text inside the em tag const labelElement = element.querySelector('.usa-label em'); labelElement.innerHTML = 'Explain why a redirect is necessary. ' + '*'; + + // Mark that we're no longer in initial load + isInitialLoad = false; }, element: document.getElementById('purpose-details-container') }, 'other': { - callback: function(value, element) { + callback: function(value, element, event) { + // Only clear errors if this is a user-initiated event (not initial page load) + if (!isInitialLoad) { + clearErrors(element); + } + // Show the purpose details container showElement(element); // change just the text inside the em tag const labelElement = element.querySelector('.usa-label em'); labelElement.innerHTML = 'Describe how this domain will be used. ' + '*'; + + // Mark that we're no longer in initial load + isInitialLoad = false; }, element: document.getElementById('purpose-details-container') } +} + +// Function to check if errors are currently displayed +function checkForErrors(element) { + const errorMessage = element.querySelector('#id_purpose-purpose__error-message'); + const formGroup = element.querySelector('.usa-form-group.usa-form-group--error'); + + // If either errors exist, set the flag to true + if (errorMessage || formGroup) { + errorsHaveBeenDisplayed = true; + } + + return errorsHaveBeenDisplayed; +} + +// Helper function to clear error messages in a textarea +function clearErrors(element) { + // Find the error message div + const errorMessage = element.querySelector('#id_purpose-purpose__error-message'); + if (errorMessage) { + errorMessage.remove(); + } + + // Find the form group and remove error class + const formGroup = element.querySelector('.usa-form-group'); + if (formGroup) { + formGroup.classList.remove('usa-form-group--error'); + } + + // Find the textarea and remove error class + const textarea = element.querySelector('#id_purpose-purpose'); + if (textarea) { + textarea.classList.remove('usa-input--error'); + + // Also update aria attributes + textarea.setAttribute('aria-invalid', 'false'); + + // Remove error message from aria-describedby + const describedBy = textarea.getAttribute('aria-describedby'); + if (describedBy) { + const newDescribedBy = describedBy.replace('id_purpose-purpose__error-message', '').trim(); + textarea.setAttribute('aria-describedby', newDescribedBy); + } + } + + // Find the label and remove error class + const label = element.querySelector('label'); + if (label) { + label.classList.remove('usa-label--error'); + } } \ No newline at end of file diff --git a/src/registrar/forms/feb.py b/src/registrar/forms/feb.py index 97b9b1ef4..3c61e613a 100644 --- a/src/registrar/forms/feb.py +++ b/src/registrar/forms/feb.py @@ -12,6 +12,8 @@ class ExecutiveNamingRequirementsYesNoForm(BaseYesNoForm, BaseDeletableRegistrar field_name = "feb_naming_requirements" + required_error_message = "Select \"Yes\" if your submission meets each domain naming requirement. Select \"No\" if it doesn't meet each requirement." # noqa: E501 + @property def form_is_checked(self): """ @@ -26,7 +28,7 @@ class ExecutiveNamingRequirementsDetailsForm(BaseDeletableRegistrarForm): widget=forms.Textarea(attrs={"maxlength": "2000"}), max_length=2000, required=True, - error_messages={"required": ("This field is required.")}, + error_messages={"required": ("Provide details on why your submission does not meet each domain naming requirement.")}, # noqa: E501 validators=[ MaxLengthValidator( 2000, diff --git a/src/registrar/templates/domain_request_dotgov_domain.html b/src/registrar/templates/domain_request_dotgov_domain.html index 57df80cb1..ceb293e8e 100644 --- a/src/registrar/templates/domain_request_dotgov_domain.html +++ b/src/registrar/templates/domain_request_dotgov_domain.html @@ -2,19 +2,25 @@ {% load static field_helpers url_helpers %} {% block form_instructions %} -
Before requesting a .gov domain, please make sure it meets our naming requirements. Your domain name must: +
+ Before requesting a .gov domain, please make sure it meets + {% if requires_feb_questions %} + our naming requirements for executive branch agencies. Your domain name must: + {% else %} + our naming requirements. Your domain name must: + {% endif %}
Names that uniquely apply to your organization are likely to be approved over names that could also apply to other organizations. - {% if not is_federal %}In most instances, this requires including your state's two-letter abbreviation.{% endif %}
+ {% if not is_federal %}In most instances, this requires including your state’s two-letter abbreviation.{% endif %} {% if not portfolio %} -Requests for your organization's initials or an abbreviated name might not be approved, but we encourage you to request the name you want.
+Requests for your organization’s initials or an abbreviated name might not be approved, but we encourage you to request the name you want.
{% endif %}Note that only federal agencies can request generic terms like @@ -29,7 +35,7 @@ {% block form_required_fields_help_text %} -{# empty this block so it doesn't show on this page #} +{# empty this block so it doesn’t show on this page #} {% endblock %} @@ -42,8 +48,8 @@
- After you enter your domain, we'll make sure it's available and that it meets some of our naming requirements. - If your domain passes these initial checks, we'll verify that it meets all our requirements after you complete the rest of this form. + After you enter your domain, we’ll make sure it’s available and that it meets some of our naming requirements. + If your domain passes these initial checks, we’ll verify that it meets all our requirements after you complete the rest of this form.
{% with attr_aria_labelledby="domain_instructions domain_instructions2" attr_aria_describedby="id_dotgov_domain-requested_domain--toast" %} {# attr_validate / validate="domain" invokes code in getgov.min.js #} @@ -65,7 +71,7 @@- Are there other domains you'd like if we can't give you your first choice? + Are there other domains you’d like if we can’t give you your first choice?
{% with attr_aria_labelledby="alt_domain_instructions" %} {# Will probably want to remove blank-ok and do related cleanup when we implement delete #} @@ -99,7 +105,7 @@ >Check availability- If you're not sure this is the domain you want, that's ok. You can change the domain later. + If you’re not sure this is the domain you want, that’s ok. You can change the domain later.
@@ -114,23 +120,21 @@OMB will review each request against the domain - naming requirements for executive branch agencies - . - Agency submissions are expected to meet each requirement. + naming requirements for executive branch agencies. Agency submissions are expected to meet each requirement. +
++ Select one. *
{% with add_class="usa-radio__input--tile" add_legend_class="usa-sr-only" %} {% input_with_errors forms.2.feb_naming_requirements %} {% endwith %} {# Conditional Details Field – only shown when the executive naming requirements radio is "False" #} -