bug: Profile Mailing Address — State/Province field appears blank because Country must be selected first, but Country comes after State in the form #114

Closed
opened 2026-05-11 16:50:05 +00:00 by spikerj · 1 comment
Owner

Problem

In the Profile > Mailing Address section, the State/Province dropdown renders blank (empty) when the user first arrives at the form. This is because the State dropdown is populated dynamically based on the selected Country, but the Country field is positioned below the State field in the form layout.

The user encounters the fields in top-to-bottom order:

  1. Street Address
  2. Street Address 2
  3. City | State/Province ← blank, no options
  4. Postal Code | Country ← must be selected first to populate State

This is confusing — the user reaches State before Country and has no way to fill it without scrolling past it, selecting a country, then scrolling back up.

Expected behavior

Either:

  • Move Country above State/Province (or above the City/State row entirely) so the user naturally selects the country first and the state dropdown is already populated by the time they reach it, OR
  • Default the Country field to a sensible value (e.g. the user's existing saved country, or inferred from locale/IP) so State is pre-populated on load, OR
  • Show all states/provinces across all countries in the State dropdown initially (grouped by country header) and auto-filter once a country is selected.

The first option (reorder Country above State) is the simplest fix and matches the convention most address forms use (Country → State → City → Street → Postal).

Steps to reproduce

  1. Navigate to Profile settings.
  2. Scroll to the Mailing Address section.
  3. Observe that State/Province is blank/empty with no selectable options.
  4. Select a Country (e.g. "United States") — State/Province then populates.

Screenshot

Mailing Address form showing blank State/Province before Country is selected

(State shows "Nebraska" in the screenshot because a country was already selected in this session, but on a fresh load without a saved country it renders empty.)

## Problem In the Profile > Mailing Address section, the **State/Province** dropdown renders blank (empty) when the user first arrives at the form. This is because the State dropdown is populated dynamically based on the selected **Country**, but the Country field is positioned _below_ the State field in the form layout. The user encounters the fields in top-to-bottom order: 1. Street Address 2. Street Address 2 3. City | **State/Province** ← blank, no options 4. Postal Code | **Country** ← must be selected first to populate State This is confusing — the user reaches State before Country and has no way to fill it without scrolling past it, selecting a country, then scrolling back up. ## Expected behavior Either: - **Move Country above State/Province** (or above the City/State row entirely) so the user naturally selects the country first and the state dropdown is already populated by the time they reach it, OR - **Default the Country field** to a sensible value (e.g. the user's existing saved country, or inferred from locale/IP) so State is pre-populated on load, OR - **Show all states/provinces across all countries** in the State dropdown initially (grouped by country header) and auto-filter once a country is selected. The first option (reorder Country above State) is the simplest fix and matches the convention most address forms use (Country → State → City → Street → Postal). ## Steps to reproduce 1. Navigate to Profile settings. 2. Scroll to the Mailing Address section. 3. Observe that State/Province is blank/empty with no selectable options. 4. Select a Country (e.g. "United States") — State/Province then populates. ## Screenshot ![Mailing Address form showing blank State/Province before Country is selected](https://git.spikersoft.com/spikerj/spikersoft-issues/raw/branch/main/assets/mailing-address-state-blank.png) _(State shows "Nebraska" in the screenshot because a country was already selected in this session, but on a fresh load without a saved country it renders empty.)_
Author
Owner

Resolved in spikersoft-angular PR #31 (merged).

The Mailing Address form was reordered to the conventional Country -> City/State -> Postal Code layout. Country now sits above State/Province, so the country-driven State list is populated by the time the user reaches it (no more blank dropdown on first load). Template-only change in address-section.component.html; the country->availableStates wiring is unchanged.

Resolved in spikersoft-angular PR #31 (merged). The Mailing Address form was reordered to the conventional **Country -> City/State -> Postal Code** layout. Country now sits above State/Province, so the country-driven State list is populated by the time the user reaches it (no more blank dropdown on first load). Template-only change in `address-section.component.html`; the country->`availableStates` wiring is unchanged.
Sign in to join this conversation.