Skip to content
Merged
Show file tree
Hide file tree
Changes from 2 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
35 changes: 35 additions & 0 deletions wants/18b2eec2-49ad-410f-be86-c20aaac2dfe9.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
---
title: I want 2D matrix dropdown form inputs
date: 2024-01-21T11:00:18.245Z
submitter: Christoph Paper
number: 18b2eec2-49ad-410f-be86-c20aaac2dfe9
tags:
- html
- forms
discussion: https://github.com/WebWeWant/webwewant.fyi/discussions/656
status: discussing
related:
- title: HTML select element
url: https://html.spec.whatwg.org/multipage/form-elements.html#the-select-element
type: spec
- title: "EN 13402: Size designation of clothes"
url: https://www.iso.org/standard/46154.html
type: note
---

Many products require two-dimensional size or variant selection where both dimensions must be chosen together and most combinations are valid. Clothing is a common example: jeans require a girth and a length, bras require a girth and a cup size, and shoes sometimes require a length and a width (as defined in EN 13402-2). The same pattern applies to many other multi-attribute selections in forms, such as shirt size plus color, date components (day plus month), or typography settings (weight plus style).

Today, authors must implement this with two separate `<select>` elements and JavaScript to coordinate them, which is error-prone, inaccessible, and verbose. I want a native two-dimensional matrix select element that lets users pick a row and a column value simultaneously, clearly communicating the paired nature of the choice.

```html
<select2d name="size">
<option2d row="XS" col="30">XS / 30</option2d>
<option2d row="XS" col="32">XS / 32</option2d>
<option2d row="S" col="30">S / 30</option2d>
<option2d row="S" col="32">S / 32</option2d>
<option2d row="M" col="32">M / 32</option2d>
<option2d row="M" col="34">M / 34</option2d>
</select2d>
```

The submitted value could be the concatenation of both axes (e.g., `XS/30`) or a structured pair, while the UI would render as a matrix or grid so the user can clearly see which combinations are available. Unavailable combinations could be disabled or hidden. This would benefit accessibility by making the relationship between the two dimensions explicit to assistive technologies, and reduce the amount of JavaScript needed for common e-commerce and data-entry scenarios.
39 changes: 39 additions & 0 deletions wants/bd9677b9-2a64-4f48-ab7f-4e581e7557ff.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
---
title: I want typed numeric input fields with units
date: 2024-01-21T11:00:18.245Z
submitter: Christoph Paper
number: bd9677b9-2a64-4f48-ab7f-4e581e7557ff
tags:
- html
- forms
discussion: https://github.com/WebWeWant/webwewant.fyi/discussions/656
status: discussing
related:
- title: I want browsers to localize data like dates and numbers
url: https://webwewant.fyi/wants/59/
type: discussion
- title: "WHATWG: input element - number state"
url: https://html.spec.whatwg.org/multipage/input.html#number-state-(type=number)
type: spec
- title: CSS Values and Units Module
url: https://www.w3.org/TR/css-values/
type: spec
---

I want a native HTML input type that accepts a numeric value together with a unit, and automatically converts the entered value to a canonical unit for form submission. Currently, `<input type="number">` accepts only a bare number with no unit awareness, forcing authors to either use a separate unit selector or restrict users to a single unit system.

A dedicated `amount` input type would let users enter values in their preferred units — metric or imperial, for example — while the browser handles conversion and normalization transparently:

```html
<input type="amount" value="10 kg" step="0.1 lb">
<input type="amount" value="5 ft 10 in" step="1 cm">
```

The browser would parse the unit attached to `value` and `step`, allow the user to type in any compatible unit (e.g., pounds when the canonical unit is kilograms), and submit the value in the canonical form. Compound measurements like `5 ft 10 in` should also be supported for height, distance, and similar fields.
Copy link

Copilot AI Apr 14, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The proposal relies on a “canonical unit for form submission”, but it’s not clearly defined how authors declare that canonical unit (especially when value is omitted) or whether step/value are intended to implicitly define it. Consider adding a sentence that explicitly defines where the canonical unit comes from (e.g., a dedicated attribute) and what happens when no default value is present.

Suggested change
The browser would parse the unit attached to `value` and `step`, allow the user to type in any compatible unit (e.g., pounds when the canonical unit is kilograms), and submit the value in the canonical form. Compound measurements like `5 ft 10 in` should also be supported for height, distance, and similar fields.
The browser would parse the unit attached to `value` and `step`, allow the user to type in any compatible unit (e.g., pounds when the canonical unit is kilograms), and submit the value in the canonical form. Authors should declare that canonical submission unit with a dedicated attribute such as `unit="kg"` or `unit="cm"`; `value` may use any compatible unit as an initial value, and `step` defines only the stepping granularity in its own unit rather than implicitly choosing the submission unit. If `value` is omitted, the control should still use the declared `unit` as the canonical unit for parsing, validation, and form submission. Compound measurements like `5 ft 10 in` should also be supported for height, distance, and similar fields.

Copilot uses AI. Check for mistakes.

This builds on the idea of an `amount` element for localizing numeric data (see related link) but focuses on form input and submission rather than display-only rendering. Benefits include:

- Users in different locales can enter values in their familiar units without manual conversion.
- Authors can declare a canonical submission unit without writing conversion logic.
- Accessibility is improved because the semantic meaning of the number (quantity + dimension) is conveyed natively to assistive technologies.
- Validation becomes more meaningful: the browser can reject out-of-range values regardless of which unit the user typed.
Loading