// Old style tag helpers
@Html.LabelFor(Model => Model.Name, "User Name", new { @class = "control-label" });
// Declarative style
<label asp-for="Name" class="control-label">User Name</label>
// add tag helpers
@addTagHelper "*, Microsoft.AspNet.Mvc.TagHelpers"
// ITagHelper
int Order { get; }
Task ProcessAsync(TagHelperContext context, TagHelperOutput output);
// Custom tag helper example
[TargetElement("div", Attributes = "panel-title")]
[TargetElement("div", Attributes = "panel-style")]
public class PanelTagHelper : TagHelper
{
[HtmlAttributeName("panel-title")]
public string Title { get; set; }
[HtmlAttributeName("panel-type")]
public HtmlPanelType PanelType { get; set; }
public override void Process(TagHelperContext context, TagHelperOutput output)
{
//<div class="panel panel-default">
// <div class="panel-heading">
// <h3 class="panel-title">Panel title</h3>
// </div>
// <div class="panel-body">
// Panel content
// </div>
//</div>
// header content
var panelHeadingContent = new TagBuilder("h3");
panelHeadingContent.SetInnerText(Title);
// header
var panelHeading = new TagBuilder("div");
panelHeading.AddCssClass("panel-heading");
panelHeading.InnerHtml = panelHeadingContent.ToHtmlString(TagRenderMode.Normal).ToString();
// body
var panelBody = new TagBuilder("div");
panelBody.AddCssClass("panel-body");
panelBody.InnerHtml = context.GetChildContentAsync().Result.GetContent();
// panel
var panel = new TagBuilder("div");
panel.AddCssClass("panel");
AddPanelTypeStyle(panel, PanelType);
// replace the custom tag with the panel just built
output.MergeAttributes(panel);
var content = panelHeading.ToHtmlString(TagRenderMode.Normal).ToString();
content += panelBody.ToHtmlString(TagRenderMode.Normal).ToString();
output.Content.SetContent(content);
base.Process(context, output);
}
private void AddPanelTypeStyle(TagBuilder panel, HtmlPanelType type)
{
switch (type)
{
case HtmlPanelType.Default:
panel.AddCssClass("panel-default");
break;
case HtmlPanelType.Primary:
panel.AddCssClass("panel-primary");
break;
case HtmlPanelType.Info:
panel.AddCssClass("panel-info");
break;
case HtmlPanelType.Success:
panel.AddCssClass("panel-success");
break;
case HtmlPanelType.Warning:
panel.AddCssClass("panel-warning");
break;
case HtmlPanelType.Danger:
panel.AddCssClass("panel-danger");
break;
default:
throw new InvalidOperationException("The panel type specified is not specified or invalid");
}
}
}
ASP.NET 5 is in beta at the time this post is published and the final version may be different than the beta version.