Skip to content

[Forms] Keep text area, checkbox and switch values in static forms - #5472

Open
NoobMaster (oONoobMasterOo) wants to merge 2 commits into
microsoft:devfrom
oONoobMasterOo:fix/ssr-input-values
Open

NoobMaster (oONoobMasterOo) wants to merge 2 commits into
microsoft:devfrom
oONoobMasterOo:fix/ssr-input-values

Conversation

@oONoobMasterOo

Copy link
Copy Markdown

In a statically rendered (SSR) form, after a post the re-rendered page sends the right values in the HTML, but the web components don't pick them up. Submitting the form again then loses them.

Component Rendered HTML Submitted value Cause
FluentTextArea value="some notes" "" fluent-textarea has no value attribute: like a native <textarea>, its default value is its content.
FluentCheckbox / FluentSwitch checked="true" ... value="True" "on" (bound as false) During the upgrade, checked is applied before value: the form value is set with the default "on", and initialValueChanged only updates the internal value.

In interactive mode, Blazor sets the value property, so this only happens with static rendering.

Changes

  • FluentTextArea renders its value as content, in addition to the value attribute.
  • FluentCheckbox and FluentSwitch render the value attribute before checked.

Unit Tests

Added:

  • FluentCheckbox_Checked_RendersValueBeforeChecked
  • FluentSwitch_Checked_RendersValueBeforeChecked

Updated the FluentTextArea markup assertions and the FluentTextArea_Default snapshot with the content.

Manual test

  • FluentUI.Samples.SSR, a static form with a [SupplyParameterFromForm] model: fill the form, submit, then submit again without changes. Before: the text area is empty and the checkbox / switch are bound as false on the second post. After: all values are kept.
  • Demo (interactive): FluentTextArea with an initial value, typing (with and without Immediate), and setting / clearing the value from code behave as before.

FluentSlider has a similar issue in fluent-slider itself (an initial value attribute is never sent as the form value until the slider is moved), which can't be fixed from the Blazor side; it needs a fix in @fluentui/web-components.

In a statically rendered form, fluent-textarea ignores the value attribute
and reads its default value from its content, and fluent-checkbox /
fluent-switch submit "on" when the checked attribute is applied before the
value attribute. The text area now renders its value as content, and the
value attribute is rendered before checked.

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

🟢 Approval recommended

The focused rendering fixes have corresponding regression coverage and no identified blocking issues; tests were not executed.

No open issues 🎉

What changed in this PR

Preserves text area, checkbox, and switch values across repeated submissions of statically rendered Blazor forms.

Changes:

  • Renders text area values as element content.
  • Places checkbox and switch value attributes before checked.
  • Updates markup assertions and adds attribute-order regression tests.
File Description
tests/​Core/​Components/​TextArea/​FluentTextAreaTests.razor Updates assertions to include text content.
tests/​Core/​Components/​TextArea/​FluentTextAreaTests.FluentTextArea_Default.verified.razor.html Updates the default snapshot.
tests/​Core/​Components/​Switch/​FluentSwitchTests.razor Tests value-before-checked attribute order.
tests/​Core/​Components/​Checkbox/​FluentCheckboxTests.razor Tests value-before-checked attribute order.
src/​Core/​Components/​TextArea/​FluentTextArea.razor Emits the current value as content.
src/​Core/​Components/​Switch/​FluentSwitch.razor Moves value before checked.
src/​Core/​Components/​Checkbox/​FluentCheckbox.razor Moves value before checked.

Review effort: Balanced

@oONoobMasterOo

Copy link
Copy Markdown
Author

The FluentSlider part is now tracked in microsoft/fluentui#36927 (the initial value of fluent-slider is not submitted with the form).

@oONoobMasterOo

Copy link
Copy Markdown
Author

The FluentCheckbox / FluentSwitch attribute order issue is also reported in microsoft/fluentui#36930.

@dvoituron Denis Voituron (dvoituron) added the Generated by AI Content generated or significantly assisted by AI. label Oct 19, 2026
@dvoituron

Copy link
Copy Markdown
Collaborator

We've added a new requirement regarding PRs

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Generated by AI Content generated or significantly assisted by AI.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants