Skip to content

[Docs] Add docs about FluentEditForm #3832

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
May 27, 2025
Merged

[Docs] Add docs about FluentEditForm #3832

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
dd4b20b
Add docs about FluentEditForm
vnbaaij May 27, 2025
e53d37d
Merge branch 'dev' into users/vnbaaij/fix-issue-#3827
dvoituron May 27, 2025
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
11 changes: 8 additions & 3 deletions examples/Demo/Shared/Pages/FormsOverviewPage.razor
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
<blockquote>
<p>
<strong>Note:</strong> When using the input components in SSR mode, be sure to assing a value to the <code>Name</code> property otherwise the
enhanced form functionalty will <strong>not</strong> work. In contrast to the standard Blazor input components a name is not automatically being
enhanced form functionalty will <strong>not</strong> work. In contrast to the standard Blazor input components a name is not automatically being
generated. <strong>Also, the <code>Name</code> needs to be prefixed with the model name (i.e. `Model.Username`).</strong>
</p>
</blockquote>
Expand Down Expand Up @@ -96,7 +96,7 @@
For a checkbox it is displayed after the input field, for a switch it is displayed in front of it.
</p>
<p>
If you would like to apply more complex markup for the label, you can use the <code>LabelTemplate</code> parameter. As this has a type of
If you would like to apply more complex markup for the label, you can use the <code>LabelTemplate</code> parameter. As this has a type of
<code>RenderFragment?</code>, it can contain virtuall anything.
</p>
<p>
Expand Down Expand Up @@ -137,12 +137,17 @@
</ul>
</p>

<h2>FluentEditForm</h2>
<p> The <code>FluentEditForm</code> inherits from the standard <code>EditForm</code>. The only thing it does is that it add a cascading parameter that contains a <code>FluentWizardStep</code> we use to register a form inside a <code>FluentWizard</code>.
</p>
<p>If you are not using a <code>FluentWizard</code> in your form, there is no need/use to use the <code>FluentEditForm</code></p>

<h2>Example</h2>

<DemoSection Title="Basic Fluent UI form" Component="typeof(BasicFormFluentUIComponents)" AdditionalFiles="@(new [] {"Starship.cs"})">
<Description>
This is an example from the standard <a href="https://learn.microsoft.com/en-us/aspnet/core/blazor/forms/input-components?view=aspnetcore-8.0#example-form">Blazor input components documentation</a> implemented with the Fluent UI Blazor input
components. It uses the <code>FluentValidationSummary</code> and <code>FluentValidationMessage</code> to give feedback on the state of the form. It
components. It uses the <code>FluentValidationSummary</code> and <code>FluentValidationMessage</code> to give feedback on the state of the form. It
uses the same <code>Starship</code> model as the standard docs and a DataAnnotationsValidator to use the data annotations set in the model.
Not all of the library's input components are used in this form. No data is actually being stored or saved.
</Description>
Expand Down
Loading