Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Table TagHelper for an IEnumerable Model (without using Reflection)

I'm trying to create a table tag helper that can parse columns and rows from the given model automatically.

This is how it should (theoretically be used):

<table for="@Model">

</table>

and this should automatically show column names and the rows.

Generating column names wasn't that difficult since I'm passing the model

[HtmlTargetElement("table", Attributes = "for")]
public class DataTableTagHelper :TagHelper
{
    [HtmlAttributeName("for")]
    public ModelExpression For { get; set; }

    public override async Task ProcessAsync(TagHelperContext context, TagHelperOutput output)
    {
        foreach (var item in For.Metadata.ElementMetadata.Properties)
        {
            // generate html for theader using item.Name
        }
    }
}

But getting the values of the model isn't as easy.

Is there a way to get the values of those properties?

I'm trying to avoid reflection, because I don't think generating HTML code though reflection with every request is a good idea.

like image 658
Hassan Khallouf Avatar asked Aug 24 '18 23:08

Hassan Khallouf


People also ask

How might you supply data from a database into a tag helper's output?

Passing a model Data to a Tag Helper We can also pass the model data to the tag helper via model binding by creating properties of type "ModelExpression". Using HtmlAttributeName attribute, we can create a friendly attribute name. The ModelExpression describes a model expression passed to the tag helper.

Which tag helper is used to perform model binding?

The Input Tag Helper binds an HTML <input> element to a model expression in your razor view.

How would the form tag helper create a form element for posting data back to the server?

The Form Tag Helper targets the HTML <form> element and generates the action URL & action method attributes. It uses the various server-side attributes like asp-controller, asp-action, asp-route- etc to generate the <form> element in the view.

What is the validation message tag helper?

The validation message tag helper targets the <span> element and is used to display a validation message for the property specified in its attribute. The following HTML is generated. Note that <span> element is empty and field-validation-valid class is applied to it.


1 Answers

We get the property's value by passing the model to its property's PropertyGetter.

public override void Process(TagHelperContext context, TagHelperOutput output)
{
    foreach (var prop in For.Metadata.Properties)
    {
        var propertyName = prop.Name;
        var propertyValue = prop.PropertyGetter(For.Model);
    }

    return Task.CompletedTask;
}

If the model implements IEnumerable, then we need to pass each item to its PropertyGetter.

public override Task ProcessAsync(TagHelperContext context, TagHelperOutput output)
{
    foreach (var item in For.Model as IEnumerable)
    {
        foreach (var prop in For.Metadata.ElementMetadata.Properties)
        {
            var name = prop.Name;
            var value = prop.PropertyGetter(item);
        }
    }

    return Task.CompletedTask;
}
like image 200
Shaun Luttin Avatar answered Oct 19 '22 09:10

Shaun Luttin