From 89661896c2e8fd09409e9be2d7bb6d6bfe194211 Mon Sep 17 00:00:00 2001 From: Jan Klass Date: Wed, 13 Sep 2023 23:49:59 +0200 Subject: [PATCH] Add missing code fencing The razor and html code is not code-fenced and renders as HTML effectively hiding from the website or rendered markdown reader. The code is there so adequate code fencing should resolve that. --- source/blazor-university-com/input/pages/forms/index.md | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/source/blazor-university-com/input/pages/forms/index.md b/source/blazor-university-com/input/pages/forms/index.md index 25a37c0..96d486f 100644 --- a/source/blazor-university-com/input/pages/forms/index.md +++ b/source/blazor-university-com/input/pages/forms/index.md @@ -18,12 +18,15 @@ The key feature to the `EditForm` is its `Model` parameter. This parameter provi Let's start by creating a class we can use with our `EditForm`. At this point a simple empty class will suffice. +```cs public class Person { } +``` Edit the standard **index.razor** page as follows: +```razor {: .line-numbers} @page "/" @@ -34,17 +37,21 @@ Edit the standard **index.razor** page as follows: { Person Person = new Person(); } +``` Line 9 creates an instance of a `Person` for our form to bind to. Line 3 creates an `EditForm` and sets its `Model` parameter to our instance. The preceding razor mark-up results in the following HTML. +```html
+``` ## Detecting form submission When the user clicks the **Submit** button in the preceding example, the `EditForm` will trigger its `OnSubmit` event. We can use this event in our code to handle any business logic. +```razor @page "/"

Status: @Status

@@ -63,6 +70,7 @@ When the user clicks the **Submit** button in the preceding example, the `EditFo // Post data to the server, etc } } +``` Form submission will be covered in more depth in the [Handling form submission](/forms/handling-form-submission/) section.