Blazor Tutorial C# - Part 7 - Blazor Form | Blazor Input | Blazor Form Validation | Blazor CRUD

Blazor Tutorial C# - Part 7 is a tutorial video which explains everything about Blazor Form, Blazor Input and Blazor Form Validation by implementing a CRUD operation in a demo Blazor application (Blazor CRUD).

Learn Blazor with Coding Droplets. Below is the Blazor Tutorial Playlist Link:

Blazor Framework supports webforms with validation using the EditForm component bound to a model that uses data annotations. Blazor ships some great components to get building web forms quickly and easily. The EditForm component allows us to manage forms, validations, and form submission events. Microsoft docs says, an EditForm renders a form element that cascades an EditContext to descendants.

EditForm manages the state of the form and any validation errors by storing it in an EditContext object. EditForm component instantiates EditContext for the model object specified in the Model attribute. We can also specify the EditContext explicitly to an EditForm component by using the EditContext attribute instead of the Model attribute.

Use the Model attribute to specify the form model object and it is sufficient to manage all standard form operations and validations. Use EditContext attribute only if you want to take more direct control over the form's EditContext object to explicitly fire a validation or to notify a field change etc.

Another attribute used in our example is OnValidSubmit. This is a callback/method that will be invoked when the form is submitted and the EditContext is determined to be valid. In addition to this, EditForm provides two other callback attributes.

OnSubmit: callback will be invoked when the form is submitted, but here we have to explicitly validate the EditContext.

OnInValidSubmit: callback will be invoked when the form is submitted and the EditContext is determined to be invalid.

We can enable validation for the entire form simply by adding the DataAnnotationsValidator component. The validation will work according to the DataAnnotations specified in our model class properties. We can show the validation summary by simply adding the ValidationSummary component or you can show the validation message for each input by using the ValidationMessage component

Video Chapters:
0:00 - Intro
3:57 - Listing Data in Table
14:30 - Saving Data using Edit Forms
32:29 - Validation & Data Annotations
38:20 - Deleting Data
47:05 - Edit Data

You can reach us at Social Media:

#blazor #codingdroplets #blazortutorial

[CodingDroplets]

Thank you for watching this video.
View the complete tutorial playlist:

[krevnimsta]

No questions, just want to thank you for the tutorial. It’s great for me to start from scratch. Everything is just on the point. Great work!

[kiwibazza]

Loving your video series. However, in this video (7), there is no sample database or the required pages you reference. Is there a place/repository where you have these available? To me, this will be on of the most relevant sessions! Appreciate the effort...thanks!

[rumpeteverything]

Is the memberService a single or transient service?

[sanketkhamkar]

you should create tutorial with MS SQL for CRED . that will give you more viewers .

[FnOTradingLearner]

can't we use grid or gridview controls for displaying table so that paging sorting etc can be automated with less code ?

[jonathanchoong]

how do you have the MongoDB? and the new Member & MemberServices how u make them?

[jonathanchoong]

now i have another prob. i cant run the memberlist as it keep having parameters like this [MissingMethodException: Cannot dynamically create an instance of type 'Members.Pages.MemberList'. Reason: No parameterless constructor defined.]

[benli]

Where is your code for this tutorial, please? we need to follow your coding rather than input from learner

[gudmo]

Hi, im getting this error and my code is exactly as yours, idk what im getting wrong...
The error is: Cannot provide a value for property 'memberService' on type There is no registered service of type

Anyone else with this error or any idea for how to solve it? Im stuck in that part, i have hours trying to solve it but i dont figure it out :( help pls, also, when i solved this error by adding the Singleton of MemberService in Program, i get another error for var database in MemberService class, telling me that that var is null or cannot be null, something like that..

[basamalhassan]

please kindly build a full working .net blazor application after this series.