[PR #913] [MERGED] Form field component #2388

Open
opened 2026-01-29 18:18:36 +00:00 by claunia · 0 comments
Owner

📋 Pull Request Information

Original PR: https://github.com/radzenhq/radzen-blazor/pull/913
Author: @yordanov
Created: 4/12/2023
Status: Merged
Merged: 4/12/2023
Merged by: @akorchev

Base: masterHead: form-field


📝 Commits (10+)

  • ebeea26 RadzenFormField WIP.
  • 1b354bd Add empty state class.
  • a01052c Add more input components. Set placeholder so it can be used from CSS.
  • 9266581 Add blank input styles
  • 70a0eba Update initial form field styles
  • 50b0ffd Update form field label position
  • 888baf4 Add ellipsis to form field label
  • 39c5dfc Position form field label in different themes
  • e9222bc Fix form field hover and focus shadows
  • c2c8b90 Remove redundant blank input styles

📊 Changes

28 files changed (+1031 additions, -22 deletions)

View changed files

📝 Radzen.Blazor/DataBoundFormComponent.cs (+15 -1)
📝 Radzen.Blazor/FormComponent.cs (+15 -1)
📝 Radzen.Blazor/RadzenAutoComplete.razor (+2 -2)
Radzen.Blazor/RadzenFormField.cs (+143 -0)
Radzen.Blazor/RadzenFormField.razor (+32 -0)
📝 Radzen.Blazor/RadzenMask.razor (+1 -1)
📝 Radzen.Blazor/RadzenNumeric.razor (+1 -1)
📝 Radzen.Blazor/RadzenPassword.razor (+1 -1)
📝 Radzen.Blazor/RadzenTextArea.razor (+1 -1)
📝 Radzen.Blazor/RadzenTextBox.razor (+1 -1)
📝 Radzen.Blazor/themes/_components.scss (+2 -1)
Radzen.Blazor/themes/components/blazor/_form-field.scss (+362 -0)
📝 Radzen.Blazor/themes/components/blazor/_input.scss (+32 -11)
📝 Radzen.Blazor/themes/dark-base.scss (+4 -0)
📝 Radzen.Blazor/themes/dark.scss (+4 -0)
📝 Radzen.Blazor/themes/material-base.scss (+25 -0)
📝 Radzen.Blazor/themes/material.scss (+25 -0)
📝 Radzen.Blazor/themes/standard-base.scss (+4 -0)
📝 Radzen.Blazor/themes/standard.scss (+4 -0)
RadzenBlazorDemos/Pages/FormFieldChildContent.razor (+50 -0)

...and 8 more files

📄 Description

A FormField component with a floating label.

FormFieldVariants


🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.

## 📋 Pull Request Information **Original PR:** https://github.com/radzenhq/radzen-blazor/pull/913 **Author:** [@yordanov](https://github.com/yordanov) **Created:** 4/12/2023 **Status:** ✅ Merged **Merged:** 4/12/2023 **Merged by:** [@akorchev](https://github.com/akorchev) **Base:** `master` ← **Head:** `form-field` --- ### 📝 Commits (10+) - [`ebeea26`](https://github.com/radzenhq/radzen-blazor/commit/ebeea26caf5be46660652c9e8de5b2df8e6bbf8d) RadzenFormField WIP. - [`1b354bd`](https://github.com/radzenhq/radzen-blazor/commit/1b354bd3adb91f32931ea540deae4e3e549ee538) Add empty state class. - [`a01052c`](https://github.com/radzenhq/radzen-blazor/commit/a01052cb9f52e9e26ddb6e85b593304c51ef2eaf) Add more input components. Set placeholder so it can be used from CSS. - [`9266581`](https://github.com/radzenhq/radzen-blazor/commit/92665815f1fe9258472ffbf96a5b16ded52bea16) Add blank input styles - [`70a0eba`](https://github.com/radzenhq/radzen-blazor/commit/70a0ebaccab35cef9dce1fe507f0f0d65cba39b8) Update initial form field styles - [`50b0ffd`](https://github.com/radzenhq/radzen-blazor/commit/50b0ffd30e2de98ecd64f7b48491fde02e06c3de) Update form field label position - [`888baf4`](https://github.com/radzenhq/radzen-blazor/commit/888baf4a1ecfdfaaaad035dd4a96e7201218931e) Add ellipsis to form field label - [`39c5dfc`](https://github.com/radzenhq/radzen-blazor/commit/39c5dfc8807c9866954c4865440f4809076a7652) Position form field label in different themes - [`e9222bc`](https://github.com/radzenhq/radzen-blazor/commit/e9222bc3bf7afd2c2631b49b2b778bf18dd722fe) Fix form field hover and focus shadows - [`c2c8b90`](https://github.com/radzenhq/radzen-blazor/commit/c2c8b90ccc5af08bb4f9a2483c88ca876acf449b) Remove redundant blank input styles ### 📊 Changes **28 files changed** (+1031 additions, -22 deletions) <details> <summary>View changed files</summary> 📝 `Radzen.Blazor/DataBoundFormComponent.cs` (+15 -1) 📝 `Radzen.Blazor/FormComponent.cs` (+15 -1) 📝 `Radzen.Blazor/RadzenAutoComplete.razor` (+2 -2) ➕ `Radzen.Blazor/RadzenFormField.cs` (+143 -0) ➕ `Radzen.Blazor/RadzenFormField.razor` (+32 -0) 📝 `Radzen.Blazor/RadzenMask.razor` (+1 -1) 📝 `Radzen.Blazor/RadzenNumeric.razor` (+1 -1) 📝 `Radzen.Blazor/RadzenPassword.razor` (+1 -1) 📝 `Radzen.Blazor/RadzenTextArea.razor` (+1 -1) 📝 `Radzen.Blazor/RadzenTextBox.razor` (+1 -1) 📝 `Radzen.Blazor/themes/_components.scss` (+2 -1) ➕ `Radzen.Blazor/themes/components/blazor/_form-field.scss` (+362 -0) 📝 `Radzen.Blazor/themes/components/blazor/_input.scss` (+32 -11) 📝 `Radzen.Blazor/themes/dark-base.scss` (+4 -0) 📝 `Radzen.Blazor/themes/dark.scss` (+4 -0) 📝 `Radzen.Blazor/themes/material-base.scss` (+25 -0) 📝 `Radzen.Blazor/themes/material.scss` (+25 -0) 📝 `Radzen.Blazor/themes/standard-base.scss` (+4 -0) 📝 `Radzen.Blazor/themes/standard.scss` (+4 -0) ➕ `RadzenBlazorDemos/Pages/FormFieldChildContent.razor` (+50 -0) _...and 8 more files_ </details> ### 📄 Description A FormField component with a floating label. ![FormFieldVariants](https://user-images.githubusercontent.com/1118895/231452220-0a39788d-3329-4978-b1bb-176a98fbf8f4.gif) --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>
claunia added the pull-request label 2026-01-29 18:18:36 +00:00
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: starred/radzen-blazor#2388