Create strongly typed HTML forms

- [Instructor] To be quite honest, I don't think I've ever worked on a web application that didn't have some kind of need for getting data from users, storing that data into some kind of database, and then retrieving it again later on. So, naturally, ASP.NET Core MVC offers great support for those kinds of scenarios, and in this video, I'll show you the first step to getting data into our system, creating an HTML form to allow users to post new blog posts to the site. I'll start by creating a new controller action, named Create, on the blog controller, along with its corresponding route.

Then, I'll go right ahead and create the view for this action. Since I'm going to be using this view to create an HTML form for editing fields in the post class, I am also going to make it a strongly typed view, by specifying the @model tag at the top of the file, and entering the full class name of the post type. Then, I'll get to work creating the HTML form that will accept input from the user. I've got several options to create the HTML that I need.

One option is to just hand-craft the HTML form fields, just like I would if I were not using Razor. This option would actually work just fine, but, ASP.NET Core MVC gives us a couple of very useful HTML helpers to render this HTML for us. For example, in order to generate the form tag that we need to wrap our form, in order to post it back to the server, we can use the Html.BeginForm helper. Since this helper returns a disposable object, we need to wrap it in a using statement.

And, when MVC renders the page, everything inside this block will be wrapped in that form tag. Once I've got a form tag, I can start adding some form fields. I'll begin with the Html.TextAreaFor helper, to render a text area element that is mapped to the body property on my post object. Notice how I use a lambda expression to select the property that I want to render the input field for. At run time, MVC will automatically resolve this lambda expression to the name of that property, and use that property name as the ID of this input field.

And, since its C sharp code, if I want to rename this field later on, using Visual Studio's renaming functionality, Visual Studio will be sure to rename this reference, too, automatically keeping everything in sync. The Text Area For helper is just one of the many HTML form helpers that ASP.NET Core MVC offers. In fact, it's got a helper for every type of HMTL form field there is. For example, TextBoxFor, HiddenFor, PasswordFor, RadioButtonFor, et cetera.

There's even a LabelFor helper to render label tags. However, there's one HTML helper that's just a little bit more helpful than the others, and that's the EditorFor helper. This particular helper is smart enough to look at the property you'd like to generate an input field for, and figure out the best HTML to render for it. For example, it'll render a password input for password fields, and it'll render a text area field for large text fields, et cetera. I'll use the EditorFor helper to create the input field for the title of the blog post.

Note that there's no HTML helper for creating buttons to submit your form. You just simply use normal HTML. When we're done, let's run our site and see how it looks. The most interesting part of this is to view the page source, and see what MVC rendered out. Notice how MVC used the URL of the current action, as the PostBack action. In other words, posting back to itself. Now, all that's left to do is handle that PostBack with a controller action.