So far, we’ve built an HTML form in the view page. When submitted it sends a URL query string to our app according to the
name attributes of the form. We captured the query values first using method parameters, then using model binding.
We can make that first step (writing a form) even easier using Tag Helpers. We expect you to be familiar with the general concept of Tag Helpers, but we’ll show you a new use for them here.
Instead of using the
id attributes in each
<input> element, we’ll use the
Take this Input Tag Helper, which uses the
It will render as this HTML:
<input type="text" name="Author" id="Author">
Why is this Tag Helper better than basic HTML? The benefits will become clearer as we create more advanced properties, but:
- It saves you the hassle of writing HTML attributes.
- Integrated Development Environments (IDEs), like Visual Studio, can check for errors before you run the code.
- Changes to the property (in a model) are automatically carried into the view page.
- Advanced settings on properties, such as data validation, are converted into additional HTML attributes. We won’t be covering those yet, so we won’t see this benefit in this lesson.
In Index.cshtml, edit the form so that it uses
asp-for instead of
Make sure that you change all three
In Index.cshtml.cs, label each property with
Run the code and submit the form. Check that your input shows up in the resulting page.