diff --git a/src/registrar/assets/js/get-gov.js b/src/registrar/assets/js/get-gov.js index f839667569..a60a59673d 100644 --- a/src/registrar/assets/js/get-gov.js +++ b/src/registrar/assets/js/get-gov.js @@ -657,6 +657,34 @@ function hideDeletedForms() { }); } +// Checks for if we want to display Urbanization or not +document.addEventListener('DOMContentLoaded', function() { + var stateTerritoryField = document.querySelector('select[name="organization_contact-state_territory"]'); + + if (!stateTerritoryField) { + return; // Exit if the field not found + } + + setupUrbanizationToggle(stateTerritoryField); +}); + +function setupUrbanizationToggle(stateTerritoryField) { + var urbanizationField = document.getElementById('urbanization-field'); + + function toggleUrbanizationField() { + // Checking specifically for Puerto Rico only + if (stateTerritoryField.value === 'PR') { + urbanizationField.style.display = 'block'; + } else { + urbanizationField.style.display = 'none'; + } + } + + toggleUrbanizationField(); + + stateTerritoryField.addEventListener('change', toggleUrbanizationField); +} + /** * An IIFE that attaches a click handler for our dynamic formsets * diff --git a/src/registrar/templates/domain_request_org_contact.html b/src/registrar/templates/domain_request_org_contact.html index 21cf19306b..f145ee3bfe 100644 --- a/src/registrar/templates/domain_request_org_contact.html +++ b/src/registrar/templates/domain_request_org_contact.html @@ -1,5 +1,5 @@ {% extends 'domain_request_form.html' %} -{% load field_helpers url_helpers %} +{% load field_helpers url_helpers static %} {% block form_instructions %}

If your domain request is approved, the name of your organization and your city/state will be listed in .gov’s public data.

@@ -37,7 +37,12 @@

What is the name and mailing address of the organization you represent?

{% input_with_errors forms.0.zipcode %} {% endwith %} - {% input_with_errors forms.0.urbanization %} + {% endblock %} + + +