Thursday, March 7, 2019

Tag Helpers in ASP.NET Core

Tag Helpers were introduced in Asp.Net Core, Tag Helpers are similar to HTML Helpers but have improved syntax to look similar to HTML elements. Tag Helpers are attributes added to normal HTML elements to provide server-side processing ability.

Tag Helpers provide IntelliSense support in Visual Studio. There are many built-in Tag Helpers for common tasks such as creating Form, Input, Label, Hyperlink etc

Let us compare the HTML helpers with the new Tag Helpers for a text-box and see the syntax difference.

HTML Helper
                @Html.TextBoxFor(m=>m.FirstName, new { @class = "input-control"})

Tag Helper
                <input asp-for="FirstName" class="input-control"/>

Following are some examples of Tag Helpers for different controls

Tag Helper for Label
     
<label asp-for="Name" class="control-label"></label>

Tag Helper for Text Box
<input asp-for="Name" class="form-control" />

Tag Helper for Hyperlink
<a asp-controller="Home" asp-action="Index">Home</a>

Tag Helper for Form
       <form asp-controller="Home" asp-action="Save" method="post">
            <!— Form Elements -->
       </form>

Tag Helper for Validation Message
<span asp-validation-for="City" class="text-danger"></span>

Search Flipkart Products:
Flipkart.com

No comments: